How to bind a collection (IEnumerable) of a custom type?

Question

I have the following action to display a form with three elements:

[HttpGet] public ActionResult ReferAFriend() { List<ReferAFriendModel> friends = new List<ReferAFriendModel>(); ReferAFriendModel f1 = new ReferAFriendModel(); ReferAFriendModel f2 = new ReferAFriendModel(); ReferAFriendModel f3 = new ReferAFriendModel(); friends.Add(f1); friends.Add(f2); friends.Add(f3); return View(friends); } 

and then the Post action

 [HttpPost] public ActionResult ReferAFriend(IEnumerable<ReferAFriendModel> friends) { if(ModelState.IsValid){ 

EDIT My view is as follows:

 @model IEnumerable<Models.ReferAFriendModel> @for(int i=0;i<Model.Count();i++) { @Html.Partial("_ReferAFriend", Model.ElementAt(i)); } 

Partially looks like this:

 @model Models.ReferAFriendModel <p> @Html.LabelFor(i => i.FullName) @Html.TextBoxFor(i => i.FullName)<br /> @Html.LabelFor(i => i.EmailAddress) @Html.TextBoxFor(i => i.EmailAddress) @Html.HiddenFor(i=>i.Id) </p> 

When I send a message, I see that the fields are located in the Request.Form object, for example, Request.Form ["FullName"] will show: "David Beckham", "Thierry Henry". "Chicharito Fergurson" which are the values ​​that I entered into the form. But in the Post action, the value for friends is always null. ReferAFriendModel has three common properties: Id, EmailAddress, and FullName.

What am I doing wrong?

Answer 1

You can see the next blog post about the wire format for arrays and dictionaries. Personally, I always use editor templates in my views, which take care of creating my own input field names so that the default binder can correctly bind values.

 @model IEnumerable<ReferAFriendModel> @using (Html.BEginForm()) { @Html.EditorForModel() <input type="submit" value="OK" /> } 

and in the corresponding editor template ( ~/Views/Shared/EditorTemplates/ReferAFriendModel.cshtml ):

 @model ReferAFriendModel @Html.EditorFor(x => x.Prop1) @Html.EditorFor(x => x.Prop2) ...