I can't get the value of my file input asp.net mvc Entity Framework

Question

I'm trying to upload my images in a folder and i'm trying to put the imagepath in my database. But I can't get my input file in asp.net mvc. How can I fix this and how can I call the input file in my Controller?

Create.cshtml

@model SecundaireSchool.Models.tblLeraren

@{
ViewBag.Title = "Create";
}

<h2>Create</h2>

@using (Html.BeginForm(new { enctype= "multipart/form-data" }))
{
@Html.AntiForgeryToken()

<div class="form-horizontal">
    <h4>tblLeraren</h4>
    <hr />
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
    <div class="form-group">
        @Html.LabelFor(model => model.naam, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.naam, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.naam, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.emailadres, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.emailadres, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.emailadres, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.foto, "test" , htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.TextBoxFor(model => model.foto, "test" , new { type = "file", @class = "input-file", @name = "file" })
        </div>
    </div>

    <!-- <div class="form-group">
        @@Html.LabelFor(model => model.foto, htmlAttributes: new { @@class = "control-label col-md-2" })
        <div class="col-md-10">
            @@Html.EditorFor(model => model.foto, new { htmlAttributes = new { @@class = "form-control" } })
            @@Html.ValidationMessageFor(model => model.foto, "", new { @@class = "text-danger" })
        </div>
    </div> -->

    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input type="submit" value="Create" class="btn btn-default" />
        </div>
    </div>
</div>
}

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

TeacherController

So i succeeded to insert the image path to my db. But it doesn't add it in my image folder. What am I doing wrong?

[HttpPost]
    public ActionResult Create(tblLeraren teacher, HttpPostedFileBase file = null)
    {
        if (ModelState.IsValid)
        {

            if (file != null && file.ContentLength > 0)
            {
                var fileName = Path.GetFileName(file.FileName);
                var path = Path.Combine(Server.MapPath("~/Images/"), fileName);
                file.SaveAs(path);
                teacher.foto = path;
            }

            db.tblLerarens.Add(teacher);
            db.SaveChanges();
            return RedirectToAction("Index");
        }

        return View(teacher);
    }

You do not have an file input with `name="file"` (but you do have one with `name="foto"` - inspect the html your generating!) You cannot change the `name` attribute using `new { @name="file" } (fortunately). Create a separate input for the file upload - ` and it will bind to your parameter when you submit. — , Jan 15 '16 at 11:01

score 2 · Accepted Answer · answered Jan 13 '16 at 10:39

2

In MVC the file object is returned as an object of HttpPostedFileBase. So just capture this object in the controller you post your form, and it will work.

[HttpPost]
    public ActionResult UploadFile(HttpPostedFileBase file)
    {

    }

answered Jan 13 '16 at 10:39

Tushar Gupta

15,504
1
29
47

score 0 · Answer 2 · answered Jan 13 '16 at 10:45

Your form needs to be multipart to be able to post images. Here is a example of how to to post image to controller action method.

@using (Html.BeginForm("Edit", "Account", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    <div class="form-group">
        <div style="position:relative">
                <input type="file" name="Image" size="40" />
        </div>
    </div>

    <button type="submit">Save</button>
}

In your AccountController have this "Edit" action method and attributed as HttpPost

[HttpPost]
public ActionResult Edit(HttpPostedFileBase image = null)
{
             //Do what ever your want with image
}

Your image should have now a value of posted image.

score 0 · Answer 3 · answered Jan 13 '16 at 11:04

First : Add below Attribute to Form :

enctype = "multipart/form-data"

like this :

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

and add HttpPost to your action Like this :

    [HttpPost]
Public ActionResult Create(httpPostedFileBase file){}

your input file and param name should same like :

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

Note : if your input file and param name in action don't same , binder enjein cant bind that , and you should get file like this

    foreach (string file in Request.Files)
{
   HttpPostedFile hpf = Request.Files[file] as HttpPostedFile;
   if (hpf.ContentLength == 0)
      continue;
   string savedFileName = Path.Combine(
      AppDomain.CurrentDomain.BaseDirectory, 
      Path.GetFileName(hpf.FileName));
   hpf.SaveAs(savedFileName);
}

I can't get the value of my file input asp.net mvc Entity Framework

Create.cshtml

TeacherController

3 Answers3

Linked