asp.net multi-File Upload example explain practical skills

Source: Internet
Author: User
Tags datetime file size file upload httpcontext

File upload simple implementation is very easy, but want higher requirements, such as uploading files through Ajax, upload multiple files at a time, file size, etc., this hole is not very easy to fill (for beginners). So here I'm going to implement multiple file uploads via Ajax. Before you start pasting code, note a few things:

1.<input type= "File"/> is required to add name, do not know why not add the Name property, the background can not get the file data (there is a way to the great God to remind me in the comment area), and then the multiple attribute, when multiple= " Multiple ", the file control can be multiple-select files that need to be uploaded (<input type=" file "multiple=" multiple "name=" MyFile "/>).

2.form to set Enctype to Multiple/form-data,multipart/form-data: No character encoding, you must use this value when you use a form that contains a file upload control. For a detailed explanation of enctype you can view the http://www.jb51.net/web/165444.html

3. The key point is that the Ajax parameters are set inside the big hole (many people do not notice many of the Ajax parameters), contenttype and ProcessData need to be set to False,contenttype is clearly required for string type, But this is set to False (I do not know why), the online description of ContentType is mostly "ContentType: Requirements for String type parameters, when sending information to the server, the content encoding type defaults to" application/ X-www-form-urlencoded ". The default value is suitable for most applications, and there is a data to be set to new FormData ($ (') [0]), to see what other parameters can be seen in this http://www.jb51.net/article/95425.htm.

Here is the simple foreground code:

<form id= "Uploadform" enctype= "Multipart/form-data" action= "/login/uploadfile" method= "POST" >
 <input Type= "File" multiple= "multiple" id= "Personfile" name= "MyFile"/> "<button" type= "
 button" id= "Submitfile" Onclick= "UploadFile ()" > Submit </button>
</form>
Upload file
 function uploadfile () {
  debugger
  $.ajax ({
  URL: '/login/uploadfile ',
  type: ' POST ',
  Cache:false,
  data:new FormData ($ (' #uploadForm ') [0]),
  processdata:false,//Key point
  contenttype:false,/ /Key point
  success:function {
   if (result). Check) {
   alert ("successful");
   }
   else {
   alert ("failed");
   }
   var file = $ ("#PersonFile")
   File.after (File.clone (). Val (""));
   File.remove ();}}
  );
 

Now the turn backstage, I this side backstage is obtains the file data set through the System.Web.HttpContext.Current.Request.Files, after the code I will take the picture for example.

 [HttpPost] public ActionResult uploadfile () {result<string> check = new result<string> ();
  try {httpfilecollection files = System.Web.HttpContext.Current.Request.Files;
  int number = 0; for (int i = 0; i < files. Count;
   i++) {System.Text.StringBuilder fileName = new System.Text.StringBuilder ();
   Filename.append (@ "D:\");
   Filename.append (DateTime.Now.ToString ("YyMMdd"));
   Filename.append (@ "\"); if (!
   System.IO.Directory.Exists (Filename.tostring ())) {System.IO.Directory.CreateDirectory (filename.tostring ()); } filename.append (System.IO.Path.GetFileNameWithoutExtension (files[i).
   FileName));
   Filename.append (DateTime.Now.ToString ("Yymmddhhmmss")); Filename.append (System.IO.Path.GetExtension (files[i).

   FileName)); System.IO.Stream sm = files[i].
   InputStream; if (System.IO.File.Exists (@ "d:\ watermark log.jpg")) {Imagehelper.zoomauto (SM, filename.tostring (), MB, "", @ "d:\ watermark Log
   . jpg "); else {Imagehelper.zoomauto (SM, Filename.tostring (), 400, 300, "Watermark Log", "");
   bool OK = System.IO.File.Exists (filename.tostring ());
   if (OK) {number++; } if (number. Equals (Files. Count)) {check. message = "Upload success!"
   "; Check.
  Check = true; } else {check. Message = "Failed!"
   "; Check.
  Check = false;
  return Json (check); The catch (Exception ex) {check. Message = ex.
  ToString (); Check.
  Check = false;
  return Json (check);

 }
 }
<summary>
 ///return value
 ///</summary> public
 class result<t>
 {public
 string message {get; set;}
 public bool Check {get; set;}
 Public ilist<t> resultlist {get; set;}
 }

Which used the Imagehelper.zoomauto (), this is Wu Jian wrote the image processing class, address http://www.cnblogs.com/wu-jian/archive/2011/02/21/1959382.html. Finally there is a hole, that is, asp.net the size of the upload data is limited, to remove the limit to 10 20 files at the same time upload. How do I unlock restrictions? It's OK to configure it inside the web.config. The code is as follows:

<system.web>
 <authentication mode= "None"/>
 <compilation debug= "true" targetframework= " 4.5 "/>
 <!-- 
 

Put the

The above is the entire content of this article, I hope to help you learn, but also hope that we support the cloud habitat community.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.