Simple multi-image upload Jquery+java code

<script type= "Text/javascript" >/** Add song */function Addsong () {var id=$ ("#_activity_id"). Val (); Window.location.href = "${pagecontext.request.contextpath}/html5/song_search.action?activityid=" +ID;} /** Delete Song */function deletesong (ActivityID, songid) {window.location.href = "song_delete.action?activityid=" + Activityid+ "&songid=" +SONGID;} /*** Save details **/function savedetails () {var activityid= $ ("Input[name= ' ActivityID ']"). Val () if (activityid== "") {alert (" No activity id "); return;} var title= $ ("Input[name= ' title ']"). Val () if (title== "") {alert ("Please fill in the title"); return; var icontext= $ ("Input[name= ' IconText ')"). Val () if (icontext== "") {alert ("Please fill in the icon text"); return; var rule = $ (' input[name= ' rule ']:checked '). Val (); if (rule== "") {alert ("The judging rule is empty"); return;} var about= $ ("textarea[name= ' about ']"). Val () if (about== "") {alert ("Please fill in"); return; var claim= $ ("Textarea[name= ' claim ')"). Val () if (claim== "") {alert ("Please fill in Request"); return; var other= $ ("textarea[name= ' other ')"). Val () if (other== "") {alert ("Please fill in other"); return; var data= "ActiviTyid= "+activityid;    data+= "&title=" +title;    data+= "&icontext=" +icontext;    data+= "&rule=" +rule;    data+= "&about=" +about;    data+= "&claim=" +claim;             data+= "&other=" +other; Image processing----------------------------------------------------------------------------------------var imgurl= "";  Take the new picture var obj = $ ("input[name= ' Imgurl_input ')");  for (Var i=0;i<obj.length;i++) {if (obj[i].value!= "" &&obj[i].value! = "undefined") {var url=obj[i].value;  Url= url.substring (parseint (Url.lastindexof ("/")) +1,url.length);  imgurl+= ("&" +url);  data+= ("&url=" +url);  }}//alert (Imgurl);  Take the modified picture var updateimgurl= ""; var updaet_img = $ ("Input[name= ' update_img_imgurl0 ']");  for (Var i=0;i<updaet_img.length;i++) {//console.log (updaet_img[i]); if (updaet_img[i].value!= "" &&updaet_img[i].getattribute ("Urlstr")! = "" && typeof (Updaet_img[i]. GetAttribute ("Urlstr"))! = "undefined") {var url=updaet_img[i].getattribute ("Urlstr"); Url= url.substring (parseint (Url.lastindexof ("/")) +1,url.length);  Updateimgurl=updaet_img[i].value+ "-" +url;  data+= ("&updateurl=" +updateimgurl);  }}//data+= "&AMP;PRIZE.URL=AAAA&AMP;PRIZE.URL=BBBB";  data+= "&AMP;URL=AAAA&AMP;URL=BBBB";    data+= "&AMP;UPDATEURL=AAAA&AMP;UPDATEURL=BBBB"; Sendajax ("${pagecontext.request.contextpath}/html5/savedateils.action", data);} function Sendajax (url,data) {//alert (data); $.ajax ({type: "POST", Url:url, DataType: "JSON", Cache:false, Data:dat  A, success:function (returndata) {alert (returndata.mess);  }, Error:function (XMLHttpRequest, Textstatus, Errorthrown) {alert ("exception occurred"); }});} /** * Image upload */function uploadimages (type, fieldName, tdid,update_img_imgurl0) {$.ajaxfileupload ({type: "POST",//with UPDA Tep get different upload text ID URL: ' uploadimg.action?uploadid= ' +type,//need to link to server address Secureuri:false, F Ileelementid:type,//File selection box id attribute (required) DataType: ' JSON ', sucCess:function (data, status) {var filePath = Data.filepath;         if (Filepath.indexof ("Too_large") >=0) {alert ("Upload file too big!");         } else if (Filepath.indexof ("error") >=0) {alert ("Upload error!");         } else {$ ("#" +fieldname). Val (FilePath);         $ ("#" +tdid+ "_img"). attr ("src", "http://s3.kgimg.com/v2" +filepath); $ ("#" +update_img_imgurl0). attr ("Urlstr", FilePath),//$ ("#" +tdid+ "_img"). Remove ();//$ ("#" +tdid). Prepend (         '  '); }}, Error:function (data, status, E) {var status = String (status), if (Status = = ' Error ') {Getologin         ();} }  });} /*** Add tag ***/function addgiftinput () {var namen=$ ("#_inputGenSize"). Val (); var namen=parseint (Namen) +1;var html= ' < Div id= "ImgGift0 ' +namen;html + = '" >  '; HTML + = ' <inPut type= "hidden" name= "Imgurl_input '; html + = '" id= "imgUrl0 ' +namen;html + = '" value= ""/> "; html + = ' <input type= '      File "id=" Imgurl_file_0 ' +namen;html + = ' "name=" imgurl_file_0 ' +namen;html + = ' "/>"; HTML + = ' <input type= "button" value= "Upload picture" class= "btn Control" onclick= "UploadImages (\ ' imgurl_file_0 ' +namen;html + = ' \ ', \ ' imgUrl0 ' +namen;html + = ' \ ', \ ' imgGift0 ' +namen;html + = ' \ ') '/> <input type= ' button ' value= ' delete ' class= ' btn          Control "onclick=" Delimagesinput (\ ' imgGift0 ' +namen+ ' \ ') "/> </div>";         $ ("#_add_gift_td"). prepend (HTML); $ ("#_inputGenSize"). Val (Namen);} /***delimagesinput Delete label ****/function delimagesinput (id) {var idj= "#" +ID;//alert (IDJ); $ (IDJ). Remove ();   /*** Delete picture ****/function delimages (id,divid) {//var activityid=$ ("#_activity_id"). Val (); alert (id); var data= "id=" +ID; $.ajax ({type: "POST", url: "${pagecontext.request.contextpath}/html5/delete_gift.action", DataType: "JSON", CACHE:FA LSE, Data:data, Success:function (returndata) {alert (Returndata.mess);   if (returndata.mess== "Success") {$ ("#" +divid). Remove ();  }}, Error:function (XMLHttpRequest, Textstatus, Errorthrown) {alert ("exception occurred");   }}); }/**** * Update Order */function Updatesequence () {var sequnames=$ ("Input[name= ' Sequenceinput ']"), Var songs=new Array (); for ( var i=0;i<sequnames.length;i++) {var activitysong=new Object ();//console.log (Sequnames[i]); var sequid=sequnames[ I].getattribute ("Sequid"); var sequ=sequnames[i].value;activitysong.id=sequid;activitysong.sequence=sequ;songs[i ]=activitysong;} var jsondata=json.stringify (songs);//var objx = eval (' (' + jsondata + ') ');//alert (jsondata); $.ajax ({type: "POST", url: "${pagecontext.request.contextpath}/html5/update_song_seq.action", DataType: "JSON",//CO Ntenttype: "Application/json", Cache:false, Data: "songs=" +jsondata, Success:function (returndata) {alert (returnData.   Mess);  if (returndata.mess== "Success") {}}, Error:function (XMLHttpRequest, Textstatus, Errorthrown) {alert ("exception occurred"); }}); }</script> 

 <tr> <td> Prizes:</td> <td id= "_ADD_GIFT_TD" > <c:foreach items= "${de  Tail.prize} "var=" Prizeobj "varstatus=" VST "> <div id=" Imggift0${vst.count} ">  <!--for updating--<input id= "Update_img_imgurl0${vst.count}" Name= "Update_img_imgurl0" C lz= "FFF" value= "${prizeobj.id}" urlstr= "" type= "hidden"/> <input type= "hidden" name= "Imgurl0${vst.count } "id=" Imgurl0${vst.count} "value=" ${prizeobj.url} "/> <input type=" file "id=" Imgurl_file_0${vst.count} "NA Me= "Imgurl_file_0${vst.count}"/> <input type= "button" value= "Upload picture" class= "btn Control" onclick= "U Ploadimages (' Imgurl_file_0${vst.count} ', ' Imgurl0${vst.count} ', ' Imggift0${vst.count} ', ' update_img_imgurl0${ Vst.count} ') "/> <input type=" button "value= "Delete Gift" class= "btn Control" onclick= "Delimages (${prizeobj.id}, ' ImgGift0 ' +${vst.count})"/> </div> &lt ;/c:foreach> <input type= "hidden" value= "${fn:length (detail.prize)}" id= "_inputgensize" > <input type= " Button "value=" New Gift "onclick=" Addgiftinput () "> </td> </tr>

Copyright NOTICE: This article for Bo Master original article, without Bo Master permission not reproduced.

Simple multi-image upload Jquery+java code