Binding a complex model to a list in MVC3

Question

I know this question has been asked before, but I haven't been able to get the correct HTML rendered based on the answers given.

Related questions:

Here is how my code is setup:

Model

public class CustomerOrderItem {
    public List<CustomerOrderItemSerialNumber> CustomerOrderItemSerialNumbers { get; set; }
    public int Id { get; set; }
    public string ShipperId { get; set; }
    public string OrderLineNumber { get; set; }
    public string LineNumber { get; set; }

    /// <summary>
    /// Return either an empty string (if no serial numbers already exist) or return the list of serial numbers separated by a line break for display in a textarea input.
    /// </summary>
    public string SerialNumber { get { return CustomerOrderItemSerialNumbers == null ? string.Empty : string.Join("\r\n", CustomerOrderItemSerialNumbers.Select(i => i.SerialNumber)); } }
}

View

<table id="orderItems" class="grid">
    <thead>
        <tr class="gridHeader">
            <th class="lineNumber">Line #</th>
            <th class="quantity">Quantity</th>
            <th class="sku">SKU</th>
            <th class="description">Description</th>
            <th class="serialNumber">Serial Number(s)</th>
        </tr>
    </thead>
    <tbody>
        @for (int i = 0; i < Model.Count; i++) {
            @Html.EditorFor(m => m[i])
        }
    </tbody>
</table>

Editor

<tr class="gridrow">
    <td class="lineNumber">@Model.LineNumber</td>
    <td class="quantity">@Model.QuantityOrdered</td>
    <td class="sku">@Model.SKU</td>
    <td class="description">@Model.Description</td>
    <td class="serialNumber">
        @Html.TextAreaFor(m => m.SerialNumber)
    </td>
</tr>

This setup results in the following HTML (only the relevant part is posted):

<td class="serialNumber">
    <textarea cols="20" name="[0].SerialNumber" rows="2"></textarea>
</td>

The name always renders as [0].SerialNumber, but I need orderItem[0].SerialNumber. I looked at Phil Haack's sample project and I don't see how he is getting the parameter name rendered.

@jrummell - I updated my question. The SerialNumber property is a bit different since it's actually based on another property within the class. It's basically acting as a friendly view property. — Justin Helgerson, Mar 16 '12 at 15:20
@jrummell - I'm not even trying to POST the data to my Action yet because I wanted to get the markup settled first. — Justin Helgerson, Mar 16 '12 at 15:35
@jrummell - I should also mention that this view is being rendered as a partial on the page. So the list of `CustomerOrderItem`'s is being passed as a model to a partial view. — Justin Helgerson, Mar 16 '12 at 15:39
@jrummell - Thanks for your post. I just figured out what my issue was. I was passing my list of items to a partial view to make my original view look a bit more clean and concise. If you pass your list as a model to a partial view and try to render it, MVC doesn't automatically add that parameter name as part of the input name. — Justin Helgerson, Mar 16 '12 at 15:43
Yes, that makes sense. I've worked around that before by making the partial a template instead. — jrummell, Mar 16 '12 at 16:32

score 1 · Answer 1 · answered Mar 16 '12 at 15:26

1

Try this:

@Html.EditorFor(m => m[i], new ViewDataDictionary() { TemplateInfo = new TemplateInfo() { HtmlFieldPrefix = "orderItem" } })

answered Mar 16 '12 at 15:26

MartinHN

19,542
19
89
131

That still results in the same HTML being rendered. – Justin Helgerson Mar 16 '12 at 15:29
Really? I'm using that approach, and works fine. You replaced my code with your EditorFor line inside the for-loop in your view, right? – MartinHN Mar 16 '12 at 15:31
Yeah, I replaced that line. It looks like that would require the editor template to be a bit different than what I have, right? Your editor template probably looks for ViewData? – Justin Helgerson Mar 16 '12 at 15:33
No, I use strongly typed model. – MartinHN Mar 16 '12 at 15:35
@MarinHN - Thanks for your post. I just figured out what my issue was. I was passing my list of items to a partial view to make my original view look a bit more clean and concise. If you pass your list as a model to a partial view and try to render it, MVC doesn't automatically add that parameter name as part of the input name. – Justin Helgerson Mar 16 '12 at 15:43
You are correct. The `EditorFor` call has to render an `EditorTemplate` from the root view for it to work. – MartinHN Mar 16 '12 at 15:46

score 0 · Answer 2 · answered Mar 16 '12 at 15:31

0

Use @Html.EditorFor() and use [DataType] attribute in your model to mention that it should be rendered as a text area

[DataType(DataType.MultilineText)]
public string SerialNumber{ get; set; }

and in your View

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

answered Mar 16 '12 at 15:31

Shyju

214,206
104
411
497

score 0 · Answer 3 · answered Mar 16 '12 at 15:43

If you are going to use array indices I don't think you need to have an editor template, but since you do have an editor template, use "foreach" instead. Just give it a try and tell me the result. As far as I know there are two approaches to the model list binding:

you go through a list like an array list[0] ect... but you dont use an editor template or you go through a foreach(var item in items) EditorFor(item).. and use an editor template... but you have crossed the two methods that I know which perhaps is causing it to bug.

So try just doing a foreach instead, and check the result.

score 0 · Accepted Answer · answered Mar 20 '12 at 21:32

I was passing my list of items to a partial view to make my original view look a bit more clean and concise. If you pass your list as a model to a partial view and try to render it, MVC doesn't automatically add that parameter name as part of the input name.

Binding a complex model to a list in MVC3

4 Answers4