当使用springMVC框架，用ajax传输带文件的表单数据

此时可以通过做两次Ajax传输来实现接受带文件的表单数据。

前台：在第一次Ajax传输时，将表单数据数据序列化，传入后台，然后在回掉方法中，借助jQuery异步上传插件AjaxFileUpload将文件上传。

HTML部分

<form class="form-horizontal" name="form1" method="post" id="form1" enctype="multipart/form-data">
     <fieldset>
        <legend></legend>
  
       	<div class="form-group">
          	<label class="col-sm-3 control-label" for="ds_host">申报部门</label>
          	<div class="col-sm-2">
             	<select id="deptList" name="deptId" class="form-control">${deptList}</select>
				<font id="deptListNotNull"></font>
          	</div>
          	          	
       </div>
       
       
       <div class="form-group">
 			<label class="col-sm-1 control-label" for="ds_host">用户信息上传</label>
 			
    		<div class="col-sm-3">
        		<input class="" id="userExcel" style="margin-top: 5px;" name="file" type="file" onchange="checkFileExt(this.value)"/>
				<font id="fileNotRight"></font>
    		</div>
       </div>
    </fieldset> 
    
</form>

　　

JS部分

var oper=$("#oper").val();
              $.ajax({
                type: "POST",
                dataType: "html",
                   url: "${contextPath}/aptitude/outsiderApplication/doOperate",
                   data: $('#form1').serialize(),
//                data: formData,
                   success: function (data) {
                       if($("#userExcel").val()!=''){
                           //进行文件上传
                           $.ajaxFileUpload({ 
                            url:'${contextPath}/aptitude/outsiderApplication/saveUserExcel?oid='+data,  
                            secureuri:false,  
                            fileElementId: 'userExcel',  
                            dataType: 'json',
                            type:'post',  
                            success:function(data){
                                if(data.flag == "all"){
                                    alert("文件全部上传成功");
                                }else if(data.flag=="notall"){
                                    alert("文件部分上传成功")
                                }
                                parent.$("#grid-table").trigger("reloadGrid");
                                parent.layer.close(index);
                            },
                            error:function(data, status, e){
                                  parent.$("#grid-table").trigger("reloadGrid");
                                  parent.layer.close(index);
                            }
                        }); 
                       }else{
                        parent.$("#grid-table").trigger("reloadGrid");
                           parent.layer.close(index);                                                           
                       }
                  },
                  error: function(data) {
                     layer.msg(data.responseText);
                     document.getElementById("submitButton").disabled=false;
                  }
            });  
             

 

 

后台：创建两个函数来分别接受非文件类型数据和文件类型数据

//接受普通表单数据
	@RequestMapping(value = "/doOperate", method = { RequestMethod.POST, RequestMethod.GET })
	public void doOperate(HttpServletRequest request, HttpServletResponse response) throws ParseException, IOException {
  //根据业务写接收代码  
}
//接受文件表单数据
	@RequestMapping(value="/saveUserExcel",method={RequestMethod.POST,RequestMethod.GET})
	public void saveContractFile(@RequestParam(value = "file", required = false) MultipartFile file,
			HttpServletRequest request, HttpServletResponse response) throws Exception {
  //根据业务写接收代码      
}