Search code examples
formsfile-uploaduploadasp.net-mvc-4httppostedfilebase

Upload in MVC4, got 2 parameters in my action but file is empty


I'm trying to upload a file to a directory. The following code worked for me

CONTROLLER

[HttpPost]
        public ActionResult Index(HttpPostedFileBase uploadFile)
        {
            //string path = @"C:\Users\thomas\Desktop";

            if (uploadFile != null)
            {
                string filePath = Path.Combine(Server.MapPath("/files"), Path.GetFileName(uploadFile.FileName));
                uploadFile.SaveAs(filePath);
            }

            return RedirectToAction("Index");
        }

HTML PAGE

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>
<form action="/Post/Index" method="post" enctype="multipart/form-data">
    <label for="uploadFile">Upload file: </label>
    <input name="uploadFile" id="uploadFile" type="file" />
    <input value="uploadFile" type="submit" />
</form>

Now i'm trying to implement this in a function where i create a message which is created by a model that is containing a message and an item class. When i submit the form the model is passed to my savecontroller but the file is null in my parameter controller.

HTML PAGE

Create new message

@model GeoCitytroopers.Models.MessageItemModel
@{
    ViewBag.Title = "Create";
}
@using (Html.BeginForm()) {
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>Event</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.Message.MessagePicture)
        </div>
        <div>
            <label for="uploadFile">Upload file: </label>
            <input name="uploadFile" id="uploadFile" type="file" />
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Message.MessagePicture)
            @Html.ValidationMessageFor(model => model.Message.MessagePicture)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.Item.ItemTitle)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Item.ItemTitle)
            @Html.ValidationMessageFor(model => model.Item.ItemTitle)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.Item.ItemDescription)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Item.ItemDescription)
            @Html.ValidationMessageFor(model => model.Item.ItemDescription)
        </div>

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

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

CONTROLLER

[HttpPost]
        public ActionResult Create(HttpPostedFileBase uploadFile, MessageItemModel ViewModel)
        {
            if (ModelState.IsValid)
            {
                Utility ut = new Utility();
                Item viewItem = ViewModel.Item;
                Message viewMessage = ViewModel.Message;

                if (uploadFile != null)
                {
                    string filePath = Path.Combine(Server.MapPath("/files"), Path.GetFileName(uploadFile.FileName));
                    uploadFile.SaveAs(filePath);
                }
                //ADD USER TO ITEM
                viewItem = ut.AddUserToItem(viewItem);

                //ADD ITEM
                viewItem.ItemCreateddate = DateTime.Now;


                //ADD DISTRICT TO ITEM
                viewItem.DistrictID = ut.GetUserDistrict();

                db.Items.Add(viewItem);

                //ADD LINK
                viewMessage.Item = viewItem;
                db.Messages.Add(viewMessage);

                db.SaveChanges();
                return RedirectToAction("Index");
            }
            return View(ViewModel);
        }

How can i pass the uploading file to my controller? Thanks in advance!


Solution

  • You forgot set the correct enctype to the form. You cannot upload files without that:

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

    Now the upload will work and your uploadFile parameter will not be null.