form序列化时向后台传递file文件

1、form中,有文件上传输入,

<form action="/task/xxxController" enctype="multipart/form-data" id="mainForm" method="post" >

<input id="FileUpload" type="file" name="files" />

</form>

2、如此上传文件后,使用$("#mainForm").submit(); 提交后,在后台Controller中获取文件即可,

获取方式为:

HttpPostedFileBase file = Request.Files["files"];

其中,[]中为input的名字。

3、后期,为了在提交form时做其他处理,将提交方式修改为下面这种方式:

$.ajax({

                                cache: true,

                                type: "POST",

                                url:"/task/xxxController",

                                data:$('#mainForm').serialize(),

                                async: false,

                                error: function(request) {

                                    alert("工单保存错误!");

                                },

                                success: function(data) {

                                    /alert("form 提交成功!");

                           }

                    });

修改后发现,在后台中,无法获得文件了,即$('#mainForm').serialize(),无法序列化文件。

4、最后,为了能够序列化文件将之传递到后台,使用如下方式处理:

var formData = new FormData($("#mainForm")[0]);

                            $.ajax({

                                cache: true,

                                type: "POST",

                               url:"/task/xxxController",

                                data: formData,

                                async: false,

                                contentType: false,

                                processData: false,

                                error: function (request) {

                                    alert("工单保存错误!");

                                },

                                success: function (data) {

                                    alert("form 提交成功!");

                                }

                            });

使用FormData的方式序列化form,可以将之传递到后台,另外,processData需要设置。

猜你喜欢

转载自jiage17.iteye.com/blog/2373859