C # ASP. NET MVC4 uses uploadify plug-ins for upload functionality

"1" first to the official website to download the plugin: http://www.uploadify.com/download/. WW I'm using a free, flash-based version. Because the version based on H5 to pay for use, and then use the plug-in is to do the completion of the website, so it is not fastidious.

"2" next in the View reference uploadify JS and CSS files, and then configure the uploadify. Note that the path here changes as the location of the Uploadify file in your program changes. I was placed in the same location as the Bin folder

<Linkrel= "stylesheet"href= "~/uploadify/uploadify.css" /><Scriptsrc= "~/uploadify/jquery.uploadify.min.js"></Script><Scripttype= "Text/javascript">Picpath=""; $(function () {        $( "#uploadify"). uploadify ({'SWF':  '/uploadify/uploadify.swf' , //relative path to the uploadify.swf file        'cancelimg': '/uploadify/uploadify-cancel.png' , //Cancel the location of the picture        'Uploader':'/account/upload',//relative path to background processing        'ButtonText': 'Upload' ,//button to display text        'Height':  the,//display height, default        'width':  the,//display width, default        'Filetypedesc': 'Image Files',        'filetypeexts': '*.gif, *.jpg, *.png',//allow file suffixes to be uploaded        'FormData': {},//parameters sent to the background        'Queueid': 'Filequeue' ,//Displays the ID of the file queue element, false by default        'Auto': false ,//set whether to upload automatically after selecting a file        'Multi': true ,//set allow multiple file uploads        'Queuesizelimit':999, //when multiple file uploads are allowed, set the number of selected files, default 999        //' OnSelect ': function (event, Queueid, fileobj) {//File selected after execution        //alert ("haha");        //},        //' Onuploadstart ': function (file) {//action before upload start        //alert ("Hello");        //},        'onuploadsuccess': function(file, data, response) {//after the upload is saved, the return value is processed            varRR= NULLRR=Eval ("(" +Data+ ")"); //alert (rr.path);Picpath=Rr.path; $("#dishesPic"). attr ("src", Picpath);    }         }); });</Script>

"3" in the same view, add the plug-in container, note the name and ID of the container, if uploadify. The plugin will look for name= "uploadify" tags

  <Div>       <inputtype= "File"name= "Uploadify"ID= "Uploadify"style= "width:120px;height:40px; "/>       <P>       <aonclick= "$ (' #uploadify '). Uploadify (' upload ')">Upload</a>       <aonclick= "$ (' #uploadify '). Uploadify (' Cancel ')">Cancel Upload</a>       </P>      <DivID= "Filequeue">      </Div></Div>

"4" in the Background controller processing code, WW I upload a picture with the plugin, and return the data containing the image save path, in the format of JSON

        //Upload         Publicjsonresult Upload (httppostedfilebase fileData) {if(FileData = =NULL||string. IsNullOrEmpty (filedata.filename) | | Filedata.contentlength = =0)            {                returnJson (New{flag =false, message ="There are no files to upload" }); }            stringFile = Path.getfilename (filedata.filename);//Get file name            stringExtension = Path.getextension (filedata.filename);//get file name extension            stringUploaddate = DateTime.Now.ToString ("YYYYMMDDHHMMSS"); stringSavedbname="pic\\"+ path.getfilenamewithoutextension (filedata.filename) + uploaddate + extension;//file name saved to the database            stringFullsavename = System.Web.HttpContext.Current.Request.MapPath ("~\\") + Savedbname;//Full pathFiledata.saveas (fullsavename); returnJson (New{flag =true, Path =savedbname}); }

Well, according to the above four steps, you can basically use uploadify this plugin upload.

If, when uploading a file, you need to pass some extra parameters, then you can use the FormData parameter, in the format ' FormData ': {"name": Value}. Then in the background crontroller, use request["name" to receive.

I qq:[email protected]

If you want to reprint, please specify the source

C # ASP. NET MVC4 uses uploadify plug-ins for upload functionality