Today, I want to upload images in batches. Google thinks that uploadify is still quite good in jquery's upload control and how to use it in close-up.
1. Download The resource package, tidy up the package in 2.1.0, and share the package for free.
Http://download.csdn.net/detail/dracotianlong/5232122
2. required resources
(1): jquery-1.3.2.min.js
(2): jquery. uploadify. v2.1.0.min. js
(3): swfobject. js
(4): uploadify.css
(5): uploadify.swf
3. Page reference
<SCRIPT type = "text/JavaScript" src = "$ {base}/thirdparty/uploadify/swfobject. js"> </SCRIPT>
<SCRIPT type = "text/JavaScript" src = "$ {base}/thirdparty/uploadify/jquery. uploadify. v2.1.0.min. js"> </SCRIPT>
<Link href = "$ {base}/thirdparty/uploadify/uploadify.css" rel = "stylesheet" type = "text/CSS"/>
4. Use
$ (Document). Ready (function () {$ ("# multiple_file_upload"). uploadify ({'upload': '$ {base}/thirdparty/uploadify/uploadify.swf? Random = '+ (new date ()). gettime (), 'canonicalize': '$ {base}/thirdparty/uploadify/cancel.png', 'script ':'.. /common/o_multiple_upload.do ', // The php file 'auto': false for processing file upload to be submitted, // whether to automatically start 'multi': True, // whether multiple files can be uploaded 'buttontext': 'brow', // The text on the button 'simuploadlimmit ': 1000, // The number of files uploaded simultaneously at a time 'sizelimmit ': 19871202, // set the size limit of a single file 'queuesizelimmit ': 1000, // The number of files in the queue must be 'filedesc':' format: JPG/GIF/JPEG/PNG/BMP. ', // if the following 'fileext' attribute is configured, this attribute is required ':'*. JPG ;*. GIF ;*. JPEG ;*. PNG ;*. BMP ', // allowed format oncomplete: function (event, queueid, fileobj, response, data) {// $ (' <li> </LI> '). appendto ('. files '). text (response); var picindexplus = picindex ++; var uploadpath = response; $ ('# picbefore '). before (pictpl (picindexplus); var uploadimgpathid = "uploadimgpath" + (picindexplus); document. getelementbyid (uploadimgpathid ). value = uploadpath;}, onerror: function (event, queueid, fileobj) {alert ("file:" + fileobj. name + "Upload Failed") ;}, oncancel: function (event, queueid, fileobj) {// alert ("canceled" + fileobj. name );}});});
5. Background code Java code
/*** Upload images in batches ** @ Param filename file name * @ Param uploadnum upload quantity * @ Param mark * @ Param file stream * @ Param Request * @ Param model * @ return * @ throws exception */@ requestmapping (value = "/common/o_multiple_upload.do ") public @ responsebody string executemultiple (string filename, integer uploadnum, Boolean mark, httpservletrequest request, httpservletresponse response, modelmap model) throws exception {Multiparthttpservletrequest multipartrequest = (multiparthttpservletrequest) request; Map <string, multipartfile> filemap = multipartrequest. getfilemap (); // store the fileurl list <string> uploadpaths = new arraylist <string> (); string fileurl = NULL; For (map. entry <string, multipartfile> entity: filemap. entryset () {// obtain the mulipartfile object multipartfile file = entity. getvalue (); weberrors errors = validate (F Ilename, file, request); If (errors. haserrors () {model. addattribute (error, errors. geterrors (). get (0); Return result_page;} cmssite site = cmsutils. getsite (request); markconfig conf = site. getconfig (). getmarkconfig (); If (mark = NULL) {mark = Conf. geton ();} // Upload File Name string origname = file. getoriginalfilename (); string ext = filenameutils. getextension (origname ). tolowercase (locale. english); tr Y {If (site. getconfig (). getuploadtodb () {string dbfilepath = site. getconfig (). getdbfileuri (); If (! Stringutils. isblank (filename) {filename = filename. substring (dbfilepath. length (); If (Mark) {file tempfile = mark (file, conf); fileurl = dbfilemng. storebyfilename (filename, new fileinputstream (tempfile); tempfile. delete ();} else {fileurl = dbfilemng. storebyfilename (filename, file. getinputstream () ;}} else {If (Mark) {file tempfile = mark (file, conf); fileurl = dbfilemng. storebyext (site. g Etuploadpath (), ext, new fileinputstream (tempfile); tempfile. delete ();} else {fileurl = dbfilemng. storebyext (site. getuploadpath (), ext, file. getinputstream ();} // Add the access address fileurl = request. getcontextpath () + dbfilepath + fileurl;} else if (site. getuploadftp ()! = NULL) {FTP = site. getuploadftp (); string ftpurl = ftp. geturl (); If (! Stringutils. isblank (filename) {filename = filename. substring (ftpurl. length (); If (Mark) {file tempfile = mark (file, conf); fileurl = FTP. storebyfilename (filename, new fileinputstream (tempfile); tempfile. delete ();} else {fileurl = FTP. storebyfilename (filename, file. getinputstream () ;}} else {If (Mark) {file tempfile = mark (file, conf); fileurl = FTP. storebyext (site. getuploadpath (), ext, n EW fileinputstream (tempfile); tempfile. delete ();} else {fileurl = FTP. storebyext (site. getuploadpath (), ext, file. getinputstream ();} // Add the URL prefix fileurl = ftpurl + fileurl;} else {string CTX = request. getcontextpath (); If (! Stringutils. isblank (filename) {filename = filename. substring (CTX. length (); If (Mark) {file tempfile = mark (file, conf); fileurl = filerepository. storebyfilename (filename, tempfile); tempfile. delete ();} else {fileurl = filerepository. storebyfilename (filename, file) ;}} else {If (Mark) {file tempfile = mark (file, conf); fileurl = filerepository. storebyext (site. getuploadpath (), ext, tempfile); Tempfile. delete ();} else {fileurl = filerepository. storebyext (site. getuploadpath (), ext, file);} // Add the deployment path fileurl = CTX + fileurl;} filemng. savefilebypath (fileurl, origname, false); uploadpaths. add (fileurl); Model. addattribute ("uploadnum", uploadnum);} catch (illegalstateexception e) {model. addattribute (error, E. getmessage (); log. error ("Upload File error! ", E);} catch (ioexception e) {model. addattribute (error, E. getmessage (); log. Error (" Upload File error! ", E) ;}catch (exception e) {model. addattribute (error, E. getmessage (); log. Error (" Upload File error! ", E) ;}// model. addattribute (" uploadpaths ", uploadpaths); Return fileurl ;}
6. Implementation results
OK.