FileUpload for ASP.NET MVC 1.0

I worked my way through the free Nerd Dinner chapter from ASP.NET MVC 1.0, creating my own web from the example. My web is a Food Recipe application where one can search among 7000 recipes on words in the title or ingredients.

The web should also be able to have pictures of the food, so I needed to do some file uploading, and so I found Scott Hanselman’s article http://www.hanselman.com/blog/ABackToBasicsCaseStudyImplementingHTTPFileUploadWithASPNETMVCIncludingTestsAndMocks.aspx. I copied some of his code, and put the parts I needed into this function (the definition of the ViewDataUploadFilesResult class is in Scott’s article):

private List<ViewDataUploadFilesResult> uploadFiles()
{
    var r = new List<ViewDataUploadFilesResult>();

    foreach (string file in Request.Files)
    {
        HttpPostedFileBase hpf = Request.Files[file] as HttpPostedFileBase;
        if (hpf.ContentLength == 0)
            continue;
        string savedFileName = Path.Combine(
           string.Concat(AppDomain.CurrentDomain.BaseDirectory,"images\\upload"),
           Path.GetFileName(hpf.FileName));
        hpf.SaveAs(savedFileName);

        r.Add(new ViewDataUploadFilesResult()
        {
            Name = savedFileName,
            Length = hpf.ContentLength
        });
    }
    return r;
}

Now, from before I had an Edit-action for the posting of my Edit View in my Controller, and from this I called the function above, as hown in the following code:

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Edit(int id, FormCollection collection)
{
    try
    {
        var recipe = recipeRepository.GetRecipe(id);
        recipe.RecipeDescription = Request.Form["RecipeDescription"];

// code removed for brevity

        List<ViewDataUploadFilesResult> fileUploaded = uploadFiles();

        if (fileUploaded.Count > 0)
            recipe.RecipePictureUrl = Path.GetFileName(fileUploaded[0].Name);

        recipeRepository.Save();
        return RedirectToAction("Index");
    }
    catch
    {
        return View();
    }
}

I also had to make some changes to my View:

First, I had to add an “enctype” to the form element. This is done like this with the Html-helper class:

<% using (Html.BeginForm("Edit", "<EntityController>", null, FormMethod.Post, new { @enctype = "multipart/form-data" })) {%>

Second, to be able to use a FileOpen dialog, I had to add an attribute to the text box for entering the file name. In plain old ASP/Html, you would use:

<input type=”file”>

And that is also what we need to do here, except we need to use the Html-helper class like this:

<%= Html.TextBox("RecipePictureUrl", Model.RecipePictureUrl, new { @type = "file" }) %>