CODEWITHSUNDEEP
asp.net-mvc
stacy bouchard
stacy bouchard

Reputation: 1

Upload a HttpPostedFileBase for image but always null

I am new to MVC and web programming.

My uploading image is working fine, but when I use almost the exact same code to allow user to modify its upload, it HttpPostedFileBase is always null. Driving me crazy...

here is the model public class ModifyGenreViewModel { public int Id { get; set; }

        [Display(Name = "Nom du style")]
        public string Name { get; set; }

        [Display(Name = "Image")]
        public HttpPostedFileBase Image { get; set; }
    }

and the view

@using (Html.BeginForm("ModifyGenre", "Upload", null, FormMethod.Post, new { enctype = "multipart/form-data" }))
        {
            @Html.AntiForgeryToken()
            <div class="form-horizontal">

                <h4>@Resource.StyleCreationHeader</h4>

                <hr />
                @Html.ValidationMessageFor(model=>Model)
                <div class="form-group" style="display:none">

                    @Html.LabelFor(model => model.Id, htmlAttributes: new { @class = "control-label col-md-2" })
                    <div class="col-md-5">
                        @Html.EditorFor(model => model.Id, new { htmlAttributes = new { @class = "form-control" } })
                    </div>
                </div>

                <div class="form-group">

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

                <div class="form-group">
                    @Html.LabelFor(model => model.Image, new { @class = "control-label col-md-2" })
                    <div class="col-md-10">
                        <input type="file" data-val="true" id="ModifyGenreViewModel_Image" name="ModifyGenreViewModel.Image" />
                        @Html.ValidationMessageFor(model => model.Image, "", new { @class = "text-danger" })
                    </div>
                </div>

                <div class="form-group">
                    <div class="col-md-offset-2 col-md-10">
                        <input type="submit" value="@Resource.Modify" class="btn btn-primary" />
                    </div>
                </div>
            </div>
        }

When I set the breakpoint in my controller, I see the Id and the name, but Image is always null.

Thank's for your help!

Upvotes: 0

Views: 808

Answers (2)

Prakash Vallabha
Prakash Vallabha

Reputation: 1

  1. In model class change it to public String Image { get; set; }

  2. In .cshtml page change it to @Html.TextBoxFor(m => m.Image, new { type = "file", name="Image" })

  3. In Controller you should use the name what you have decleared in html helper HttpPostedFileBase Image

Upvotes: 0

Shyju
Shyju

Reputation: 218732

The name property value of your file input should match with the view model property name for model binding to work properly.

Change the input field name to "Image"

<input type="file" data-val="true" id="ModifyGenreViewModel_Image" name="Image" />

Assuming your HttpPost action method accepts the ModifyGenreViewModel object as parameter.

[HttpPost]
public ActionResult ModifyGenre(ModifyGenreViewModel  model)
{
  // to do : return something
}

Upvotes: 2

Related Questions