Upload series: Ajaxupload.js

Ajaxupload.js

Last time said Jquery.upload.js, this time again ajaxupload.js, this actually also relatively simple answer, only a JS file:

HTML code:

1 $ (function () {2 var btnupload = $ (' #upload ');3 New Ajaxupload (Btnupload, {4 action: '/system/upload ',//upload address5 name: ' UploadFile ',//file name Word6 onsubmit:function (file, ext) {//Pre-upload action7 if (! ( Ext &&/^ (jpg|gif|jpeg|png) $/.test (EXT))) {8 $.messager.alert (' Hint ', ' pro ', please select JPG, PNG, GIF, JPEG pictures! ');9 return false;Ten                 } One var ele = $ (". Imglist li"); A if (ele.length >= 5) { - $.messager.alert (' Hint ', ' pro, upload up to five photos! '); - return false; the                 } -             }, - oncomplete:function (file, response) {//post-upload operation (information returned by the response server) -var html = '<Li><span><imgsrc= "' + response + '"/><P>'; + if ($ (". Imglist"). Find (' li '). Length > 0) { -HTML + = '<inputtype= "Radio"name= "img"value= "' + response + '" />'; + } else { AHTML + = '<inputtype= "Radio"name= "img"value= "' + response + '"checked= "Checked" />'; at                 } -HTML + = '<ahref= "javascript:void (0)"onclick= "defimg (this)">Main diagram</a>|<ahref= "javascript:void (0)"onclick= "delimg (this)">Delete</a>'; -HTML + = '</P></span></Li>'; - $ ('. Imglist '). Append (HTML); -             } -         }); in});

View Code

The background code is similar to Jquery.upload.js, but one thing to note is that this ajaxupload.js in the background to accept files, such as the background method:

1  Public actionresult Upload (httppostedfilebase FileData) 2         {3            4         }

View Code

MVC does not map directly to it, so there are more deceptive where we need to go through the code and get the upload file.

1  Public actionresult Upload (httppostedfilebase FileData) 2         {3             FileData = request.files["uploadfile"]; 4         }

View Code