如何使用Ajax请求在Asp.net MVC中上传图像

Question

如何使用Ajax请求在Asp.net MVC中上传图像我有单个控制器，其视图文件必须使用Ajax请求。

索引控制器

public ActionResult Index()
{
     return View();
}

和它的观点

Answer 1

id =“imageUploadForm”的文本框

<input type="file" id="imageUploadForm"  name="image" multiple="multiple" />

Ajax功能

 $(document).ready(function() {
       $("#imageUploadForm").change(function() {
         var formData = new FormData();
         var totalFiles = document.getElementById("imageUploadForm").files.length;
         for (var i = 0; i < totalFiles; i++) {
           var file = document.getElementById("imageUploadForm").files[i];
           formData.append("imageUploadForm", file);
         }
         $.ajax({
           type: "POST",
           url: '/Home/Upload',
           data: formData,
           dataType: 'json',
           contentType: false,
           processData: false
             //success: function(response) {
             //    alert('succes!!');
             //},
             //error: function(error) {
             //    alert("errror");
             //}
         }).done(function() {
           alert('success');
         }.fail(function( xhr, status, errorThrown ) {
             alert('fail');
           };
         });
       });

控制器功能

  [HttpPost]
    public void Upload()
    {
        for (int i = 0; i < Request.Files.Count; i++)
        {
            var file = Request.Files[i];

            var fileName = Path.GetFileName(file.FileName);

            var path = Path.Combine(Server.MapPath("~/App_Data/"), fileName);
            file.SaveAs(path);
        }

    }