SoFunction
Updated on 2025-03-07

MVC implements batch file upload

According to the project needs, I studied how to implement batch file uploading in the following. First, introduce single file upload; then, introduce how to implement multi-file upload.

1. Single file upload

The principle of single file upload is to put file data into a request, and pass it directly from the page to the background controller, similar to passing parameters between the view and the controller, and directly pasting the code and commenting.
Code in the file:

<form enctype="multipart/form-data" method="post">
  <input type="file"  />
  <input type="submit" value="Upload" />
</form>

Code in Controller:

[HttpPost]
public ActionResult Upload(FormCollection form)
{
  if ( == 0){
        // Uploading is unsuccessful if the number of files is 0        return View();
      }
  var file = [0];
  if ( == 0){
    //When the file size is large (in bytes) is 0, do some operations    return View();
  }
  else{
    //The file size is not 0    file = [0]; //The UpLoadFile folder on the server must have read and write permissions    string target = ("/")+("/Mock/Learning/");//Get the path to the target folder    string filename = ;//Get the file name    string path = target + filename;//Get the storage target address    (path);}
    return View();
}


It should be noted here that in the case, the default size of the request is 4M, so if you need to upload a larger file, you need to change it.

<>
<httpRuntime maxRequestLength="40960"/> 
</>

2. Upload batch files

The idea is to dynamically add upload controls according to user needs through js, and multiple files are uploaded to the controller through request.
Code in the file:

&lt;form enctype="multipart/form-data" method="post"&gt;
  &lt;div &gt;
    &lt;div&gt;
      &lt;input type="file"  name="file0"/&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;p&gt;
    &lt;a onclick="AddFile();"&gt;Add a file&lt;/a&gt;
  &lt;/p&gt;
  &lt;p&gt;
    &lt;input type="submit" value="Upload" /&gt;
  &lt;/p&gt;
&lt;/form&gt;

&lt;script&gt;
var index = 1;    
function AddFile() {      
  var ul = ("FileList");
  var inputDiv = ("div");
  ("Id", "div" + index);
  var file = ("input");
  ("type", "file");
  ("id", "file" + index);
  ("name", "file" + index);
  var btnDel = ("input");
  ("type", "button");
  ("value", "delete");
  ("Id", index);
   = function() {
    (file);
    (btnDel);
    (inputDiv);
  }      
  (file);
  (btnDel);
  (inputDiv);
  index++;
}
&lt;/script&gt;

Code in Controller:

[HttpPost]    
public ActionResult Upload(FormCollection form)    
{      
  foreach (string item in )
  {        
    HttpPostedFileBase file = [item] as HttpPostedFileBase;        
    if (file==null ||  == 0)
      continue;  
    //Display whether the Upload folder exists, create it if it does not exist.    string path = ("..//Upload"); 
    if (!(path)) 
    {          
      (path); 
    }       
    path =  + "Upload/";       
    //Get the uploaded file name    string fileName = ; 
    //Upload    ((path,fileName)); 
  }      
  return Content("&lt;script&gt;alert('Uploading the file successfully');();&lt;/script&gt;");   
}

Note that in the case, the index of different files is the name attribute value of the upload control, so in the aspx page code, it is necessary to ensure that the name attribute values ​​of multiple upload controls are different from each other.

The above realizes batch file upload.

I am a little talented and knowledgeable, and it is for your reference only. If there is any inappropriateness, please criticize and correct me!

The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.