Next step of programming

File upload in ASP.NET MVC

with 7 comments

Here is a sample for handling upload of a file, In your MVC application. In this sample i used the Dialog box of JQuery, where user will select the file and will click upload

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">    

<h2>Files uploaded to server</h2>    

<div id="dialog" title="Upload files">        
    <% using (Html.BeginForm("Upload", "File", FormMethod.Post, new { enctype = "multipart/form-data" }))
    {%><br />
        <p><input type="file" id="fileUpload" name="fileUpload" size="23"/> ;</p><br />
        <p><input type="submit" value="Upload file" /></p>        
    <% } %>    
</div>
<a href="#" onclick="jQuery('#dialog').dialog('open'); return false">Upload File</a>
</asp:content>

Then we have to handle this request in the respective controller which is specified in BeginForm of our above code (FileContoller) and action name (Upload). Following will be our code in the FileController Controller for the Upload action

public void Upload()
{
foreach (string inputTagName in Request.Files)
{
HttpPostedFileBase file = Request.Files[inputTagName];
if (file.ContentLength > 0)
{
string filePath = Path.Combine(HttpContext.Server.MapPath("../Uploads")
, Path.GetFileName(file.FileName));
file.SaveAs(filePath);
}
}

RedirectToAction("Index", "File");
}

Download the sample code from here

File upload in MVC with JQuery Dialog

7 Responses

Subscribe to comments with RSS.

1. hi,
   I’m working with mvc application.Problem is that, when i work with FileUpload control with mvc,i store filepath and name into database,so give me one example for uploading image file path and store that into database.

   

   Binal

   May 26, 2009 at 10:25 am

   Reply
   • Your comment is awaiting moderation.

     hi,
     I’m working with mvc application.Problem is that, when i work with FileUpload control with mvc,i store filepath and name into database,so give me one example for uploading image file path and store that into database.

     

     Binal

     May 26, 2009 at 10:42 am

     Reply
     • If i am not wrong you want to upload the image with your MVC application and want to save the uploaded path in the database for the future reference. If this is the case then as you might have seen the sample there is one upload function. In that function you will get the file uploaded path, then with the help of you model part of the MVC Project (In my sample Model part is having LINQ) save that path in the database

       If you were asking some thing else please rectify me and i will try to give some solution as soon as possible

       

       A.Sethi

       May 29, 2009 at 4:39 pm
2. Ran your example using firefox and after a couple of times testing the download, firefox consumes 50% of the processor as soon as I select the File Tab. Runs fine in IE.

   I get no indications what is wrong except the task managers shows firefox at the top of the process list and growing. Max’s out arounf 2500000

   

   Jerry

   August 22, 2009 at 12:40 pm

   Reply
   • Thanks for information

     I will have a look to it and come back to you as soon as possible

     

     A.Sethi

     August 28, 2009 at 6:37 am

     Reply
3. Gente, agrego una correccion al método Upload para que funcione como se debe.

   Queda corregido asi:

   public ActionResult Upload()
   {
   ….
   return RedirectToAction(“Index”, “File”);
   }

   Un saludo a todos y gracias por el ejemplo !!

   Antonino

   

   Antonino Ferrando

   November 6, 2009 at 8:40 pm

   Reply
   • Thanks for correcting me

     

     A.Sethi

     November 7, 2009 at 1:41 pm

     Reply