吃水不忘挖井人,如果对你有帮助,请说声谢谢。如果你要转载,请注明出处。谢谢!
异步提交时,出现图片不能上传。
起初我定格在 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 formData = new FormData($(element)[0]); ???????????$.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; } ???}}
MVC ?Ajax.BeginForm ?提交上传图片
原文地址:http://www.cnblogs.com/valeb/p/7588021.html