How to bind a list property in MVC?

Question

I have a Create/Update Irrf view:

 @using (Html.BeginForm("Update", "ParamsController", FormMethod.Post))
 {
        <div class="row">
            @Html.DropDownList("Year", Model.Years.Select(p => new SelectListItem { Value = p.ToString(), Text = p.ToString() }), new { @class = "form-control", name = "Ano", id = "AnosDropDown" })
            @Html.ValidationMessageFor(n => n.Years)
         </div>
         <hr/>

           <div id="irrContent">
                @Html.Partial("_Irrf", Model.List.ToList())
           </div>

          <button class="col-xs-12 btn btn-success" data-enviaform>Save</button>                   
    }

In the ParamsController :

    public ActionResult Irrf(int? year)
    {
        if (!year.HasValue)
            year= DateTime.Now.Year;

        var model = new IrrfViewModel
        {
            IrrfList = _service.Get(year.Value),
            Years = _service.GetYears(),
            Year = year.Value
        };

        if(Request.IsAjaxRequest())
            return PartialView("_Irrf", model.IrrfList.ToList());

        return View(model);
    }

In the _Irrf PartialView:

@model  List<Application.IrrfDTO>

 @for (var i = 0; i < Model.Count(); i++)
 { 
     <div class="mb20 col-xs-12 col-sm-4">
        @Html.TextBoxFor(n => Model[i].FinalValue, new { @class = "form-contro" })
    </div>

 }

And in the Post Action:

 public ActionResult Update(IrrfViewModel model)
 {
     //Code

 }

The IrrfViewModel:

 public class IrrfViewModel
 {
    public IEnumerable<IrrfDTO> IrrfList { get; set; }
    public IEnumerable<int> Years { get; set; }
    public int Year { get; set; }
 }

I dont know how do i bind the property IrrfList inside of the IrrfViewModel.

Any Suggestions?

Take a look at [Model Binding To A List](http://haacked.com/archive/2008/10/23/model-binding-to-a-list.aspx/). — Erik Philips, Apr 15 '16 at 15:51
Your viewModel already contains the IrrfList so the model binder should do the magic for you — VeNoMiS, Apr 15 '16 at 15:54
Do not use partials - use a `for` loop or an `EditorTemplate`. You partial is generating `name` attributes without the necessary `IrrfList` prefix (needs to be `name="IrrfList[0].FinalValue" in order to bind to your collection). Refer [this answer](http://stackoverflow.com/questions/30094047/html-table-to-ado-net-datatable/30094943#30094943) for an example of both — , Apr 15 '16 at 22:13

score 0 · Answer 1 · answered Apr 15 '16 at 18:15

You should use Editor templates.

Create a new razor view called IrrfDTO.cshtml inside ~/Views/Home/(Assuming your GET action method is inside HomeController. Change the location according to your requirements.

Inside this new view, have this code

@model ReplaceWithYourNameSpaceHere.IrrfDTO
<div>
    @Html.TextBoxFor(s=>s.FinalValue)
</div>

Now in your main view, simply use Html.EditorFor helper method.

@model IrrfViewModel
@using(Html.BeginForm())
{
 <!-- Your other form controls goes here -->
    <div id="irrContent">
         @Html.EditorFor(s => s.IrrfList)
    </div>
    <button class="col-xs-12 btn btn-success" data-enviaform>Save</button>
}

Editor template will gnerate the correct names for the input for each item in the IrrfList property(ex: IrrfList[0].FinalValue ,IrrfList[1].FinalValue)

Since the input property names are good, Modelbinder will be able to map the posted form values to an object of IrrfViewModel in your HttpPost action.

[HttpPost]
public ActionResult Update(IrrfViewModel model)
{
  // check model.IrrfList property.
  // to do : Return something
}

How to bind a list property in MVC?

1 Answers1