Struts2 + uploadify Multi-File upload complete example!

first of all, I'm using the Jquery Uploadify3.2 version number here.

Import the relevant CSS JS

<link rel= "stylesheet" type= "Text/css" href= "<%=basepath%>css/uploadify/uploadify.css" >
<script src= "<%=basepath%>js/jquery.min.js" ></script>

<script src= "<%=basepath%>js/uploadify/jquery.uploadify.min.js" ></script>

Next is the uploaded JSP page code

<form action= "" method= "post" >    <input type= "file" Name= "Img_file" id= "Img_file" >    <div id= " Uploadfilequeue "></div>    <div id=" IMGs "></div>    <div id=" Dialog-message "></ div>    </form>            <p>          <a href= "javascript:void (0);" onclick= "Myupload ()" > Upload </a >        <a href= "javascript:$ (' #img_file '). Uploadify (' Cancel ')" > Cancel upload </a>      </p>  

Here is the most critical JS code has to stare

$ (function () {$ ("#img_file"). Uploadify ({auto:false,//) to upload height:30, ButtonText: ' Select Picture ', Cancelimage: ' <%=basepath%>img/uploadify/uploadify-cancel.png ', swf: ' <%=basepath%>js/uploadify/ Uploadify.swf ',//expressinstall: ' js/uploadify/expressinstall.swf ', uploader: ' <%=basepath%>json/ Fileuploadaction.action ',//Background processing upload file action width:120, ' multi ': true,//set to True will agree to multiple file uploads ' fi                   Lesselected ': ' 4 ', Queueid: ' Uploadfilequeue ', fileobjname: ' Img_file ',//same as the file property in the background action * *                                formdata:{//Companion value ' userid ': ' 111 ', ' username ': ' Tom ', ' Rnd ': ' 111 '}, */filetypedesc: ' Upload file Supported file formats: Jpg,jpge,gif,png ', filetypeexts: ' *.jpg;*.jpge;*.gif;*.png ',//*.jpg;*.jpge;*.gif                     ; *.pngqueuesizelimit:4,//can only upload 4 images at a time//simuploadlimit:1,//can upload 1 files at a time filesizelimit: ' 2097152 ',//upload file maximum value in bytes 2M Returns an error. Trigger Onselecterror when selecting a file: function (file, ErrorCode, errormsg) {switch (ErrorCode) {Case-100:alert ("the number of uploaded files has exceeded the system limit 4 Files made!
");                              Break Case-110:alert ("File [" +file.name+ "] size exceeds the 2M size of the system limit.                                  ");                              Break Case-120:alert ("File [" +file.name+ "] size is abnormal!
");                              Break Case-130:alert ("File [" +file.name+ "] type is wrong!                                  ");                          Break }},////upload server,server to return the corresponding information to data Onuploadsuccess:fu Nction (file, data, response) {var objs = eval (' (' +data+ ') '); var phtml = "<span></span> ";                      if ($ ("#imgs span"). Length==0) {$ ("#imgs"). HTML (phtml);                      }else{$ ("#imgs span:last"). After (phtml);                               }}, Onselect:function (file) {//alert (file.name);                     },//removecompleted:true,//the uploaded file progress bar disappears Requeueerrors:false, removetimeout:2,//the time the progress bar disappears. ImpliedThink 3 progressdata: "Percentage",//Display the percentage of uploads onuploaderror:function (File,errorcode , errormsg,errorstring,swfuploadifyqueue) {//Here is the time when cancellation occurs//$ ("#dialog-message"). HTML (errorstring)                          ;         }     });      });       Upload file function Myupload () {$ ("#img_file"). Uploadify (' upload ', ' * ');     }

Java-uploaded Action code

/** * Upload file action * @author Wzh * */@Controller @scope ("prototype") public class Fileuploadaction extends Baseaction {privat e File img_file; private string img_filecontenttype;//format above "filename" +contenttype private string img_filefilename;//format "filename" + FileName Private String savepath;//file is saved after uploading the path private map<string, object> dataMap = new hashmap<string, object& gt; (); @Override/*** * upload file */public String execute () throws Exception{system.out.println ("Savepath" +getsavepath ());   File Dir=new file (Getsavepath ());  System.out.println (Dir.getabsolutepath ());          Infer if there is a path if (!dir.exists ()) {dir.mkdirs ();        }//Files currently uploaded file File=getimg_file ();         Get suffix String ext =fileutil.getextensionname (Getimg_filefilename ());            String NewFileName = Uuid.randomuuid () +ext;              FileOutputStream fos=new FileOutputStream (Getsavepath () + "//" +newfilename); FileInputStream fis=new FileInputStream (Getimg_file ());             byte []buffers=new byte[1024];              int len=0;              while ((Len=fis.read (buffers))!=-1) {fos.write (Buffers,0,len);            } fos.close ();          Fis.close ();            String uploadfilename = Getimg_filefilename (); Datamap.put ("filename", newfilename); return SUCCESS;}

<!--file uploads related to-<action name= "fileuploadaction" class= "fileuploadaction" >        <param name= "Savepath" >E:/Tomcat6.0/webapps/uploads</param>        <result type= "JSON" ><param name= "root" >datamap </param></result>       </action>

Configure the above basic is OK what do not understand to be able to comment and ask. I will reply

Watermark/2/text/ahr0cdovl2jsb2cuy3nkbi5uzxqvq0phdmvy/font/5a6l5l2t/fontsize/400/fill/i0jbqkfcma==/dissolve/70 /gravity/southeast ">

Watermark/2/text/ahr0cdovl2jsb2cuy3nkbi5uzxqvq0phdmvy/font/5a6l5l2t/fontsize/400/fill/i0jbqkfcma==/dissolve/70 /gravity/southeast ">

Copyright notice: This article blog original article. Blogs, without consent, may not be reproduced.

Struts2 + uploadify Multi-File upload complete example!