Uploading image in ASP.NET MVC

Question

I have a Upload form and I want to pass my information such as an Image and some other field but I don't know how can I upload Image ..

this is my controller code :

[HttpPost]
        public ActionResult Create(tblPortfolio tblportfolio)
        {
            if (ModelState.IsValid)
            {
                db.tblPortfolios.AddObject(tblportfolio);
                db.SaveChanges();
                return RedirectToAction("Index");  
            }

            return View(tblportfolio);
        }

And this is my view code :

@model MyApp.Models.tblPortfolio

<h2>Create</h2>

@using (Html.BeginForm(null, null, FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>tblPortfolio</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.Title)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Title)
            @Html.ValidationMessageFor(model => model.Title)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.ImageFile)
        </div>
        <div class="editor-field">
            @Html.TextBoxFor(model => model.ImageFile, new { type = "file" })
            @Html.ValidationMessageFor(model => model.ImageFile)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Link)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Link)
            @Html.ValidationMessageFor(model => model.Link)
        </div>

        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}

Now I don't know how can I upload Image and save it on server .. how can I set Image name by Guid.NewGuid(); ? Or how can I set Image Path ?

I ended up generating a GUID for each new image and saving its name in the database. The folder isn't saved to the server, just the image file name. The folder is dynamically injected. — Shimmy Weitzhandler, Jan 15 '13 at 03:40
**[Uploading multiple files upload in asp.net mvc 4 razor provides client-side validation too.](http://lesson8.blogspot.in/2013/05/how-to-create-and-editorfor-fileupload.html)** — Sender, May 25 '13 at 04:44
checkout my answer http://stackoverflow.com/a/40990080/4251431 — Basheer AL-MOMANI, Dec 06 '16 at 07:50

score 45 · Accepted Answer · answered May 01 '12 at 18:29

45

Firstly, you'll need to change your view to include the following:

<input type="file" name="file" />

Then you'll need to change your post ActionMethod to take a HttpPostedFileBase, like so:

[HttpPost]
public ActionResult Create(tblPortfolio tblportfolio, HttpPostedFileBase file)
{
    //you can put your existing save code here
    if (file != null && file.ContentLength > 0) 
    {
        //do whatever you want with the file
    }
}

answered May 01 '12 at 18:29

Mathew Thompson

55,877
15
127
148

1

I use your code and I think it works correctly but it show to me an error : Access to the path 'C:\Users\Administrator\Desktop\ND\MyApp\MyApp\Uploads' is denied. Do you know why ? why it shows to me this error on local ? – Persian. May 01 '12 at 18:58
1

Hmmm, You need to find out from the application pool for the website what is the identity it is running under (by default this is Application Pool Identity) and grant that the correct permissions. – Mathew Thompson May 01 '12 at 19:12
1

I Change my Application Pool Identity to Localsystem .. I red somewhere about this that I must change it to localsystem but it's not working .. any suggestion ? – Persian. May 01 '12 at 19:27
2

Hmm, look here http://learn.iis.net/page.aspx/624/application-pool-identities/ and make sure you've followed all those steps, that should work fine :) – Mathew Thompson May 01 '12 at 19:32
@Persian Good stuff! Glad I could help :) – Mathew Thompson May 01 '12 at 20:25
Here's some more information http://haacked.com/archive/2010/07/16/uploading-files-with-aspnetmvc.aspx – John Zumbrum May 24 '12 at 20:04

score 3 · Answer 2 · edited Feb 10 '23 at 23:05

You can get it from Request using Request.Files Collection, In case of single file upload just read from the first index using Request.Files[0]:

[HttpPost]
public ActionResult Create(tblPortfolio tblportfolio) 
{
 if(Request.Files.Count > 0)
 {
 HttpPostedFileBase file = Request.Files[0];
 if (file != null) 
 { 
  // business logic here  
 }
 } 
}

In case of Multiple files uploading, you have to iterate on the Request.Files collection:

[HttpPost] 
public ActionResult Create(tblPortfolio tblportfolio)
{ 
 for(int i=0; i < Request.Files.Count; i++)
 {
   HttpPostedFileBase file = Request.Files[i];
   if (file != null)
   {
    // Do something here
   }
 }
}

Uploading image in ASP.NET MVC

2 Answers2

Linked