Uploading, Downloading, Displaying / Streaming and Deleting Multiple Files in ASP.NET MVC (C#):

Download Sample Source Code - Working With Files ASP.NET MVC 5


File Streaming

 


 

File processing- Working with Files (Uploading / Downloading / Displaying Streaming / Deleting) using C# in ASP.NET  MVC 4 and MVC 5 , here we are going to cover following :

Setting up form method and content type

Uploading Files

Downloading Files

Streaming / Displaying Files

Deleting Files

 

This article will work for all types of files- Images / Videos ( .jpg, .png, .bmp, .jpeg, .gif, etc. ),  Documents (.pdf, .docx, .xml,  .zip, .rar, etc), etc

Setting up form method and content type:

In Web Forms, when you drag a FileUpload control on to the designer, html form that wraps the entire page is decorated with an extra attribute: enctype="multipart/form-data" and method=”post”.

  • method=”post” - is needed because the form by default will be submitted via the HTTP get method.

  • enctype="multipart/form-data" - is needed to post form in multiple parts.

The FileUpload itself is rendered as an html input type=file. Within an MVC View, there are a number of ways to set this up. The first is with HTML:

 

<form action="/Home/UploadFile" method="post" enctype="multipart/form-data">
<input type="file" name="FileUpload" /><br />
<input type="submit" name="Submit" id="Submit" value="Upload" />
</form> 

In ASP.NET MVC this can be done using using the Html.BeginForm() extension method  as follows :

 

@using (Html.BeginForm("UploadFile", "Home", FormMethod.Post, new {enctype="multipart/form-data"})){ 
<input type="file" name="FileUpload" /><br />
    <input type="submit" name="Submit" id="Submit" value="Upload" />
} 

 

Uploading File

Uploading File On Server :

We have seen how to post files (ASP.NET MVC Working With Files - Setting up form method and content type-Post File ), files will be available in post method defined in controller. Using Request.Files and HttpPostedFile we are going to upload using following code.

This is generic code, will work with uploading multiple files (if multiple files are posted)

 


public class HomeController : Controller
{ 

[HttpPost]
public ActionResult UploadFile()
{  
foreach (int i;i< Request.Files.Count; i++)

{

HttpPostedFileBase hpf = Request.Files[file];

if (hpf.ContentLength == 0)

continue;

// You have to make sure ‘File Uploads’ directory exists

string savedFileName = Path.Combine(

AppDomain.CurrentDomain.BaseDirectory+ "FileUploads/",

Path.GetFileName(hpf.FileName));

  hpf.SaveAs(savedFileName);

}

return View();
}
}

 

Uploading Multiple Files On Server:

Now that we have see how to post file and how to upload file on server.

  1. ASP.NET MVC Working With Files - Setting up form method and content type (Post Files)

  2. ASP.NET MVC Working With Files - Uploading File On Server

In order to upload multiple file you just need to add input control (type="file") in view.

View -

 

@using (Html.BeginForm("UploadFile", "Home", FormMethod.Post, new {enctype="multipart/form-data"})){ 

<input type="file" name="FileUpload1" multiple/><br />

    <input type="submit" name="Submit" id="Submit" value="Upload" />
}

 

OR

(If you have specific number of files to upload you can define as follows - (max upload as 5 files))

 

@using (Html.BeginForm("UploadFile", "Home", FormMethod.Post, new {enctype="multipart/form-data"})){
<input type="file" name="FileUpload1" /><br />
<input type="file" name="FileUpload2" /><br />
<input type="file" name="FileUpload3" /><br />
<input type="file" name="FileUpload4" /><br />
<input type="file" name="FileUpload5" /><br />
    <input type="submit" name="Submit" id="Submit" value="Upload" />
} 
Post Method-

 


public class HomeController : Controller
{ 

[HttpPost]
public ActionResult UploadFile()
{  
foreach (int i;i< Request.Files.Count; i++)

{

HttpPostedFileBase hpf = Request.Files[file];

if (hpf.ContentLength == 0)

continue;

// You have to make sure ‘FileUploads’ directory exists

string savedFileName = Path.Combine(

AppDomain.CurrentDomain.BaseDirectory+ "FileUploads/",

Path.GetFileName(hpf.FileName));

  hpf.SaveAs(savedFileName);

}

return View();
}
}

Downloading File

public FilePathResult DownloadFile(string fileNameWithExtention)
{
 string path = AppDomain.CurrentDomain.BaseDirectory + "FileUploads/";
 string fileName = fileNameWithExtention;
 return File(path + fileName, "text/plain", "test.txt");
}

 

Streaming / Displaying File


public FileStreamResult StreamFile(string fileNameWithExtention)
{
  string path = AppDomain.CurrentDomain.BaseDirectory + "FileUploads/";
  string fileName = fileNameWithExtention;
  return File(new FileStream(path + fileName, FileMode.Open), "text/plain", fileName);
}

Displaying on view you can use something like this -

 

<img src=”http://YourSite.com/Files/StreamFile/Test.jpg" />

 

Deleting File

To Delete file from server please include Namespace: System.IO and use File.Delete()


public void DeleteFile(string fileNameWithExtention){ 
	string path = AppDomain.CurrentDomain.BaseDirectory + "FileUploads/"; 
	if (File.Exists(path + fileNameWithExtention){
		File.Delete(path + fileNameWithExtention);
	}
}

 


Download Sample Source Code - Working With Files ASP_NET MVC 5
Please like this article on social site if this worked for you… Coding is fun !!! Isn't it...