FormData uploads files,

FormData uploads files,

Form submission:

<Form id = "uploadForm" action = "http: // localhost: 8080/cfJAX_RS/rest/file/upload "method =" post "enctype =" multipart/form-data "> However, page Jump is required.


Ajax:


$.ajax({       url : "http://localhost:8080/STS/rest/user",       type : "POST",       data : $( '#postForm').serialize(),       success : function(data) {            $( '#serverResponse').html(data);       },       error : function(data) {            $( '#serverResponse').html(data.status + " : " + data.statusText + " : " + data.responseText);       }  });  

As shown above, the form can be serialized using $ ('# postform'). serialize () to pass all parameters in the form to the server. However, the above method can only pass common parameters. The file stream uploaded to the file cannot be serialized and transmitted. However, mainstream browsers now support an object named FormData. With this FormData, we can easily upload files using Ajax.


FormData. JQuery is used here.
Html code

<Form id = "uploadForm"> <p> specify the file name: <input type = "text" name = "filename" value = ""/> </p> <p> upload a file: <input type = "file" name = "file"/> </p> <input type = "button" value = "Upload" onclick = "doUpload () "/> </form>
Js Code


function doUpload() {       var formData = new FormData($( "#uploadForm" )[0]);       $.ajax({            url: 'http://localhost:8080/cfJAX_RS/rest/file/upload' ,            type: 'POST',            data: formData,            async: false,            cache: false,            contentType: false,            processData: false,            success: function (returndata) {                alert(returndata);            },            error: function (returndata) {                alert(returndata);            }       });  }  



To be continued...




 
 
 
  

    Top 
  
 
 
  

    0 
  
 

 
 

 
 
 
  

    Step on 
  
 
 
  

    0 
  
 

 
 
 
 
View comments