MVC 5.0(or5.0↓) Ajax.BeginForm 異步上傳附件問題，答案是不能的！

MVC 5.0(or5.0↓)  Ajax.BeginForm 異步上傳附件問題，答案是不能的！

（請注意我這里說的異步!）

來看一下下面這段一步提交file的代碼

//前台 .cshtml 文件

<script src="~/jquery.unobtrusive-ajax.js"></script>
@using (Ajax.BeginForm("upLoadAsync", "UploadFile",   
    new AjaxOptions {   
        HttpMethod = "Post",  
        OnSuccess = "success"
　　}
　　, new { enctype = "multipart/form-data" }
))  
{  
    <input type="file" id="fileupload" name="Upload" />
    <input type="submit" value="上傳" id="btn"> 
}  

//C#代碼

public string upLoadAsync()
{
　　HttpPostedFileBase file = Request.Files["Upload"];

　　HttpPostedFileBase file = Request.Files[0];

　　//其余代碼省略

　　//......

}

當debug到這里，你們就發現不管是 Request.Files["Upload"]亦或是 Request.Files[0] 都不會取到文件流。

這就是我要說的，當使用Ajax.BeginForm(jquery.unobtrusive-ajax.js) 異步上傳是不可行的，因為文件流不會被C#代碼讀取

但是並不影響 Ajax.BeginForm(jquery.unobtrusive-ajax.js) 異步提交表單的特性。

 

那我我們應該如何異步提交表單呢？

利用 $("#formID").ajaxSubmit({});這個方法異步提交表單並且上傳文件。

//前台 .cshtml 文件

<script src="~/jquery.form.js"></script>

  <form id="formID" method="post" enctype="multipart/form-data">
　　　　@Html.Hidden("yearNow1", @ViewBag.yearNow as string)//輸入一些要提交表單的值

　　　　<input type="file" id="fileupload" name="Upload" />
　　　　<input type="button" value="上傳" id="btn">//這里用button代替submit
　</form>

<script type="text/javascript">

 $("#btn").click(function () {
　　$("#formID").ajaxSubmit({
                url: "@Url.Action("upLoadAsync", "UploadFile")",
                type: "post",
                success: function (data) {
                   //......
                },
                error: function (aa) {
                    alert(aa);
                }
            });
});

//C#代碼

public string upLoadAsync()
{
　　HttpPostedFileBase file = Request.Files["Upload"];

　　HttpPostedFileBase file = Request.Files[0];

　　//其余代碼省略

　　//......

}

當debug到這里，你們就發現不管是 Request.Files["Upload"]亦或是 Request.Files[0] 都可以取到文件流。

當controller返回值也可以成功進入seccess方法中。

 

請注意我代碼中標紅的位置，以防遺漏導致一直debug無果問題！

 

總結一下：

1、MV5 5.0中異步提交表單方法兩種：Ajax.BeginForm(new AjaxOptions:post) 和 $("#formID").ajaxSubmit({})

2、MVC 5.0中異步提交表單上傳文件一種：$("#formID").ajaxSubmit({})