Anupam Singh
Anupam Singh

Reputation: 1166

How to Achieve model binding for Complex types

My model is :

public class ContactInfo
        {

            public IEnumerable<SupplierContact> PriceRequest { get; set; }
            public IEnumerable<SupplierContact> OrderConfirmation { get; set; }
            public IEnumerable<SupplierContact> Account { get; set; }
        }




 public class SupplierContact
    {
        public int Id { get; set; }
        public string FirstName { get; set; }
        public string LastName { get; set; }
        public string Title { get; set; }
        public string Email { get; set; }
        public string MobilePhone { get; set; }

    }

and my Controller action is

public ActionResult EditContactInfo(ContactInfo contactInfo)
{
// not getting any values here..
}

View is rendering like :

 @foreach (SupplierContact PriceRequest in Model.PriceRequest)
                {
                <tr class="">
                    <td style="text-align: left;" class="csstd-left">@Html.TextBoxFor(m => PriceRequest.Email)</td>
                    <td class="csstd">@Html.TextBoxFor(m => PriceRequest.MobilePhone)</td>
                    <td class="csstd">@PriceRequest.Title</td>
                    <td class="csstd">@PriceRequest.FirstName</td>
                    <td class="csstd">@PriceRequest.LastName</td>                  

                </tr>
                }

And I am referencing @model ContactInfo in my view

However i can achieve it using

Request.Form.Get("PriceRequest.Email")

but I want to use model binding feature .

Upvotes: 0

Views: 43

Answers (2)

LockTar
LockTar

Reputation: 5465

Take a look at display and editor templates. Than you can create a view called SupplierContact. MVC automatically knows what to show if he see the complex type.

See this example: http://www.asp.net/mvc/tutorials/javascript/using-the-html5-and-jquery-ui-datepicker-popup-calendar-with-aspnet-mvc/using-the-html5-and-jquery-ui-datepicker-popup-calendar-with-aspnet-mvc-part-2

So create a folder: DisplayTemplates in your views folder. Then create a partial view called SupplierContact. Set the model of the partial view as a SupplierContact. Create the labels for displaying and run your application again.

For editing, create a EditorTemplates folder.

Upvotes: 0

user3559349
user3559349

Reputation:

You need to use a for loop (and you will need to change the collections from IEnumerable to IList to the name attributes are correctly indexed

@for (int i = 0; i < Model.PriceRequest.Count; i++) {
  @Html.TextBoxFor(m => Model.PriceRequest[0].Email)
  @Html.TextBoxFor(m => Model.PriceRequest[i].MobilePhone)
}

Alternatively you can create a EditorTemplate for SupplierContact and use

@Html.EditorFor(m => m.PriceRequest)

This will generate html like

<input name="PriceRequest[0].Email" ...
<input name="PriceRequest[0].MobilePhone" ...
<input name="PriceRequest[1].Email" ...
<input name="PriceRequest[2].MobilePhone" ...

etc.

Upvotes: 1

Related Questions