关于MVC Ajax.BeginForm()异步上传文件的问题

Posted 何瑶龙

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了关于MVC Ajax.BeginForm()异步上传文件的问题相关的知识,希望对你有一定的参考价值。

问题描述:

  如果用juqery原生的异步上传方式,只要如下方法即可

$.ajax({
             type: "GET",
             url: "test.json",
             data: {username:$("#username").val(), content:$("#content").val()},
             dataType: "json",
             success: function(data){
alert("");
}
})
但是既然用MVC就应该利用它的优势,所以就用了如下方法

@using (Ajax.BeginForm("Upload", "Index", new AjaxOptions() { HttpMethod = "Post", OnSuccess = "onSuccess" }, new { enctype = "multipart/form-data", id = "uploadForm" }))
{
<input type="hidden" name="id" value="@ViewBag.id">
<input type="file" id="scan" name="image" value="浏览.." />
<input type="submit" value="上传" />
}

在后台用

public ActionResult UpLoad(HttpPostedFileBase file)

{

file = Request.Files["image"];

}

好了在后台能拿到数据完美了,但是问题也来了,异步异步,就是是否成功与否都要返回到前台data;

data是返回了,但是却返回到了Action Upload页面,而请求的页面是Index页面。

然后我马上想到了mvc有一个自带的异步js文件能解决异步返回请求的页面 文件如下:

<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>

但是这个异步只是针对<input type=text>类型的,对于 enctype = "multipart/form-data" 类型的后台的file就一直取不到

然后经过度娘的帮助找到了这个厉害的js文件,就解决了这个问题哈哈文件如下:

Jquery.form.js

 










以上是关于关于MVC Ajax.BeginForm()异步上传文件的问题的主要内容,如果未能解决你的问题,请参考以下文章

asp.net mvc  Ajax.BeginForm 异步上传图片的问题

asp.net core mvc 异步表单(Ajax.BeginForm)

MVC Ajax.BeginForm 提交上传图片

mvc Html.BeginForm和Ajax.BeginFrom表单提交

自坑实录 - Asp.net MVC中无法使用@Ajax.BeginForm问题解决

MVC Ajax.BeginForm 替换奇怪的行为