@Scripts.Render("//cdnjs.cloudflare.com/ajax/libs/jquery.form/3.51/jquery.form.min.js")

[HttpPost]
[ValidateAntiForgeryToken]
public string Index([Bind(Include = "images")] Product product)
{
    /* Let's put our variables in a dictionary */
    var response = new Dictionary<string, string> {
        { "status", "0" },
        { "message", "" },
        { "images", "" }
    };

    if (ModelState.IsValid)
    {
        /* Image uploade handler */
        try
        {
            HttpFileCollection hfc = System.Web.HttpContext.Current.Request.Files; /* Retrieve files from form request */
            string path = "/Content/Images/Uploads/"; /* Location to store images */
            List<string> images = new List<string>(); /* Initialize an empty list for our images */

            /* Check if Products Directory exists */
            if (!Directory.Exists(path))
            {
                /* Create Products directory if not exists */
                Directory.CreateDirectory(Server.MapPath("~") + path);
            }

            /* Process each image */
            for (int i = 0; i < hfc.Count; i++)
            {
                HttpPostedFile hpf = hfc[i];
                if (hpf.ContentLength > 0)
                {
                    string file_name_original = Path.GetFileNameWithoutExtension(hpf.FileName); /* Original file name with extension */
                    string file_name = GlobalMethods.GenerateRandomString(20); /* Generate a random string for our image name */
                    string file_extension = Path.GetExtension(hpf.FileName); /* Get file extension */
                    string file_path_with_file_name = path + file_name + file_extension; /* Final image path */

                    /* Append single image to our images list */
                    images.Add(file_name + file_extension);

                    /* Move files to the specified directory on the "path" variable */
                    hpf.SaveAs(Server.MapPath(file_path_with_file_name));
                }
            }

            /* If there is an image uploaded, let's include them to the response dictionary */
            if (images.Count > 0)
            {
                if (!String.IsNullOrEmpty(original_data_detached.images))
                {
                    /* Get existing images from database then convert it to an array */
                    var old_images_array = new JavaScriptSerializer().Deserialize<dynamic>(original_data_detached.images);

                    /* Add old images to the new images list variable*/
                    foreach (var image in old_images_array)
                    {
                        images.Add(image);
                    }
                }

                /* Convert images list to json */
                response["images"] = new JavaScriptSerializer().Serialize(images);

                product.images = response["images"];
            }
        }
        catch (Exception ex)
        {
            throw ex;
        }
       
        db.Entry(product).State = EntityState.Modified;

        /* Do not update images field if there are no new posted images */
        if (String.IsNullOrEmpty(product.images))
        {
            db.DontUpdateProperty<Product>("images");
        }

        db.SaveChanges();
        response["status"] = "1";
        response["message"] = "Successfully Updated";
    }

    /* Then we return the Dictionary in json format to our front-end */
    string json = new JavaScriptSerializer().Serialize(response);
    return json;
}

namespace MyApp.Models
{
    public class Product
    {
        public int id { get; set; }
        public string images { get; set; }
    }

    public class ProductDBContext : DbContext
    {
        public DbSet<Product> Products { get; set; }
    }
}