MVC Ajax.BeginForm 提交上传图片

吃水不忘挖井人，如果对你有帮助，请说声谢谢。如果你要转载，请注明出处。谢谢！

异步提交时，出现图片不能上传。

起初我定格在  System.Web.Mvc  中。查询源码时，也是没有问题的。那问题出现在哪 里？

答案：JS 

jquery.unobtrusive-ajax.js

经查看，修改如下Demo：

 function asyncRequest(element, options) {
        var confirm, loading, method, duration, enctype, is_async = true;

        confirm = element.getAttribute("data-ajax-confirm");
        if (confirm && !window.confirm(confirm)) {
            return;
        }

        loading = $(element.getAttribute("data-ajax-loading"));
        duration = element.getAttribute("data-ajax-loading-duration") || 0;

        $.extend(options, {
            type: element.getAttribute("data-ajax-method") || undefined,
            url: element.getAttribute("data-ajax-url") || undefined,
            beforeSend: function (xhr) {
                var result;
                asyncOnBeforeSend(xhr, method);
                result = getFunction(element.getAttribute("data-ajax-begin"), ["xhr"]).apply(this, arguments);
                if (result !== false) {
                    loading.show(duration);
                }
                return result;
            },
            complete: function () {
                loading.hide(duration);
                getFunction(element.getAttribute("data-ajax-complete"), ["xhr", "status"]).apply(this, arguments);
            },
            success: function (data, status, xhr) {
                asyncOnSuccess(element, data, xhr.getResponseHeader("Content-Type") || "text/html");
                getFunction(element.getAttribute("data-ajax-success"), ["data", "status", "xhr"]).apply(this, arguments);
            },
            error: getFunction(element.getAttribute("data-ajax-failure"), ["xhr", "status", "error"])
        });

        enctype = element.getAttribute("enctype");
        if (enctype == "multipart/form-data") {

var form = $(element)[0];
var input_files = $(form).find(":file");
var fileSize = 0;
for (var i = 0; i < input_files.length; i++) {
for (var j = 0; j < input_files[i].files.length; j++) {
fileSize += input_files[i].files[j].size;
}
}
if (fileSize > 1024) {
alert("上传文件大于10M,不允许上传");
return;
}
var formData = new FormData(form);

            $.extend(options, {
                async: false,
                cache: false,
                contentType: false,
                processData: false,
                data: formData
            });
            is_async = false;
        }
        if (is_async)
            options.data.push({ name: "X-Requested-With", value: "XMLHttpRequest" });

        method = options.type.toUpperCase();
        if (!isMethodProxySafe(method)) {
            options.type = "POST";
            if (is_async)
                options.data.push({ name: "X-HTTP-Method-Override", value: method });
        } 
        $.ajax(options);
    }

@{
    ViewBag.Title = "Index";
}
<script src="~/Scripts/jquery-1.8.2.js"></script>
<script src="~/Scripts/modernizr-2.6.2.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>

@model MvcApplication.Models.TestModel 
 @using (Ajax.BeginForm("TestAjax", "Home", null, new AjaxOptions() { HttpMethod = "POST" ,OnSuccess="Success"}, new { id = "f1", enctype = "multipart/form-data"}))
 {
     @Html.TextBoxFor(S => S.Name)
     @Html.TextBoxFor(S => S.Age)
     @Html.TextBoxFor(S => S.fileBase, new { type = "file" })
     @Html.TextBoxFor(S => S.IsDel, new { Value = "1" })
     <button type="submit">OK</button>
 }
<script type="text/javascript">
    function Success(data) {
        alert(data.Name);
    }
</script>

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace MvcApplication.Controllers
{
    public class HomeController : Controller
    {
        //
        // GET: /Home/

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

        public ActionResult TestAjax(Models.TestModel model)
        {
            model.fileBase = null;
            return Json(model, JsonRequestBehavior.AllowGet);
        }

    }
}

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace MvcApplication.Models
{
    public class TestModel
    {
        public HttpPostedFileBase fileBase { get; set; }
        public string Name { get; set; }
        public int Age { get; set; }
        public bool IsDel { get; set; }
    }
}