The project uses the picture without the refresh upload, therefore thought uses the ajaxuploadfile to solve.
The first step is to introduce the Ajaxfileupload.js file you downloaded to your local page in the upload image.
Files: http://download.csdn.net/detail/up19910522/7471163
The second step, write the JS code to upload the file
function Uploadimage () {var f = document.getElementById (' filetoupload '). Files[0];alert (F.name); $.ajaxfileupload ({ Fileelementid: ' filetoupload ', url: '/zhdm/chat/uploadimage ', DataType: ' Text ', data: {},async:true,error:function (da TA) {alert (data); Alert ("Network exception, please retry");},success:function (message) {alert (message);}})}
The third step. Receive files in the background and store
@RequestMapping (value = "Uploadimage", method = requestmethod.post) public @ResponseBodyString uploadimage ( HttpServletRequest request) throws IllegalStateException, IOException {System.out.println ("Enter the control layer"); String pathstring= ""; User Loginuser = (user) request.getsession (). getattribute ("Loginuser");//Infer if the session is invalid if (Loginuser = = NULL | | ". Equals (Loginuser)) {return" 250 ";} int loginuserid = Loginuser.getuserid (); list<string> paths = new arraylist<> ();//Set context commonsmultipartresolver Multipartresolver = new Commonsmultipartresolver (Request.getsession (). Getservletcontext ());//Check if the form has enctype= "Multipart/form-data" if ( Multipartresolver.ismultipart (Request)) {Multiparthttpservletrequest multirequest = (multiparthttpservletrequest) Request;iterator<string> iter = Multirequest.getfilenames (); while (Iter.hasnext ()) {// Inherited by Commonsmultipartfile, with the method above. Multipartfile file = Multirequest.getfile (Iter.next ()); System.out.println ("File:" + file.getsize ());//If the file is not empty, then process if (!file. IsEmpty ()) {//The picture file name is processed. Gets the last 6 characters. Then take the "." Gets the file suffix for the delimiter string originalfilename = File.getoriginalfilename ();//Gets the suffix string suffixstring = Originalfilename.substring (Originalfilename.lastindexof (".") + 1);//Get IP address string ip = new Checkipimpl (). Checkipaddress (request);//Obtain an IP address + timestamp as the file name to prevent the file name from repeating iptimestamp iptimestamp = new Iptimestamp (IP); String randomfilename = Iptimestamp.getiptimerand ();//Set file name called string fileName = Randomfilename + "." + suffixstring;//address is D:\\fileupload\\license directory under String path = "D:" + file.separator + "FileUpload" + file.separator + "chat" + file.separator+ fi Lename; String Targerpath = "D:" + file.separator + "FileUpload" + file.separator + "Chat" + File.separator + "M" + fileName; File LocalFile = new file (path), try {File.transferto (localfile);//Save the picture name and relative path to the database Paths.add ("/pic/chat/" + fileName); pathstring = "pic/chat/" + fileName;} catch (IllegalStateException e) {e.printstacktrace ();} catch (IOException e) {e.printstacktrace ()}}}} Pathstring= "Cao"; return Pathstring;}
Fourth, front page code:<div class= "Creatgroup ml50" id= "Addlicensephoto" >
Then you can upload the file.
The author here by the back of the back to the foreground JSON error problem solved.
is to put Ajax in theDataType: ' JSON ', replaceDataType: ' Text ',
Copyright notice: This article Bo Master original articles, blogs, without consent may not be reproduced.
Left and right ajaxfileupload background back to JSON rule