Spring HTML5 drag and drop upload multiple files

Note: This is just a rough note. Some code might not work. You might update a version number that you can use again. Deficiencies, please forgive me.

1. The spring environment is built here using the Spring3 jar, which requires the introduction of Common-io and Common-fileupload jar packages at the same time.

1.1spring. Xxx.xml File Configuration Bean

<bean id= "Multipartresolver" class= "Org.springframework.web.multipart.commons.CommonsMultipartResolver" > <property name= "maxuploadsize" value= "${web.maxuploadsize}"/></bean>

Value= "xxxx" according to the actual situation changes.

2.html form

<form id= "Uploadform" action= "Data/mydata4pipeiupload" method= "post" enctype= "Multipart/form-data" > <div class= "Upload_box" > <div class= "Upload_main" > <di V class= "Upload_choose" > <span id= "Filedragarea" class= "Upload_drag_area" > Please drag the file to this Upload </span> <input id= "fileimage" size= "name=" fileselects["multiple=" multiple "type=" file "> </div> <div id=" preview "class=" upload_p Review "></div> </div> <div id=" Uplo Adinf "class=" Upload_inf "></div> </div> <div class=" Upload_box "                        ; FileName 2:<input name= "filefiename" id= "Filefiename"/> </div> <div CLAss= "Modal-footer" > <button class= "btn btn-primary" type= "Submit" id= "SubmitBut3" data-dismiss= "modal" > Upload data Documents </BUTTON> </DIV> </form>

2.1 In addition to some formatting requirements for normal uploads. Note that multiple files need to be name= "xxx[" "multiple=" multiple "

<input id= "Fileimage" size= "" Name= "fileselects[" multiple= "multiple" type= "  file" >

2.2 were used here upload.js and zxxfile.js. To configure the relevant parameters

3. The background code is written in two ways.

3.1

@RequestMapping (value = "/mydata4pipeiupload", method = requestmethod.post) public void HandleRequest ( HttpServletRequest request,               HttpServletResponse response) throws Exception {           //transition to Multiparthttprequest:          multiparthttpservletrequest multipartrequest = (multiparthttpservletrequest) request;         list<multipartfile> singlefiles = Multipartrequest.getfiles ("fileselects[]");                     if (Singlefiles!=null&&singlefiles.size () >0) {        for (Multipartfile file:singlefiles) {        //Get file name:           String filename = file.getoriginalfilename ();        Get input stream:           inputstream input = File.getinputstream ();           Write to file           //or:           "file Source = new File" ("d:/dd/" +filename);           File.transferto (source);}}}      

Note the acquisition of the parameter to use fileselects[] to get the list

3.2, write the request name directly to @requestparam

@RequestMapping (value = "/mydata4pipeiupload", method = requestmethod.post) public void HandleRequest (@RequestParam (" Fileselects[] "multipartfile[] files,httpservletrequest request,   HttpServletResponse response) throws Exception {              if (files!=null&&files.length>0) {for (Multipartfile file:files) {//Get file name:   String filename = File.getoriginalfilename ();//Get input stream:   inputstream input = File.getinputstream ();   Write to file   //or:   "file Source = new File" ("d:/dd/" +filename);   File.transferto (source); }}}  

This way you can do it again.

Spring HTML5 drag and drop upload multiple files