关于ajax提交Form同时上传文件

我们在使用ajax提交表单时,如果想同时上传表单文件,正常提交时后台接受File值为空,如需提交时携带文件,可使用FormData,代码如下:

JSP:
"index_form"   name= "index_form"   role= "form"   method= "post"   class = "form-horizontal"   enctype= "multipart/form-data" >

      
           
   
           
  
           
                       
      
图片一 : "pic1" name="pic1" type="file" onchange="pic1()"/>
 用户名 : "pic2" name="pic2"  type="text" />
 密码: "pic3" name="pic3"   type="text" />
 value="提交" type="submit" />


JS:

var file =  $("#fileId").get(0).files[0];

var formData = new FormData(); 

formData.append("file",file);

$.ajax({
       url:uploadFileUrl,
       type:"POST",
       async : false,
       dataType:"json",
       data:formData,
       contentType: false,
       processData: false,
       success:function(data) {
     }

});

var artform = $("#expert_form").serialize()";

  $.ajax({
cache : true,
type : "post",
url : submitFormUrl,
data : artform,
async : false,
success : function(data) {

},
error : function(request) {

}

   });

action: 

需要两个action,一个为上传文件的action,一个为提交表单的action。

注意:如果用两个ajax(一个上传文件,一个提交表单),需设置 async : false,

ajax方法默认是异步执行的,即不管有没返回结果都可以继续往下执行
要想等ajax方法返回结果再执行下面的方法,需要设置为同步async:false

你可能感兴趣的:(日常程序)