如何将表绑定到模型的列表属性?

时间:2014-07-17 11:50:52

标签: c# asp.net-mvc binding

我面临一个问题,即将表中表示的数据发布并绑定到模型类中的对象列表属性。

这是我的模型定义

public class Design
{
    public Featuredproducttype[] FeaturedProductTypes { get; set; } 
}
public class Featuredproducttype
{
    public string Id { get; set; }
    public string Label { get; set; }
    public string Count { get; set; }
    public string Display { get; set; }
    public string Visible { get; set; }
    public string Action { get; set; }
}

我有一个html表来表示FeaturedProductType[]中的每个项目,如下所示:

<table class="table responsive shopex-table table-hover no-margin">
    <thead>
        <tr>
            <th>
                Featured sub product type
            </th>
            <th>Label</th>
            <th>What to display?</th>
            <th>Display count</th>
            <th>Action</th>
            <th>
                &nbsp;
            </th>
        </tr>
    </thead>

    <tbody>
        <tr>

        </tr>
        @for (int i = 0; i < Model.FeaturedProductTypes.Length; i++)
        {
             <tr>
                <td class="vcenter">
                    <a href="#" onclick="jQuery('#modal-window').modal('show', { backdrop: 'static' });">@Model.FeaturedProductTypes[i].Label</a>
                </td>
                <td class="vcenter">

                    @Model.FeaturedProductTypes[i].Lable
                </td>
                <td class="vcenter">
                    @Model.FeaturedProductTypes[i].Display
                </td>
                <td class="vcenter">
                    @Model.FeaturedProductTypes[i].Count
                </td>
                <td class="vcenter">
                    @Model.FeaturedProductTypes[i].Action
                </td>
                <td class="vcenter text-right">
                    &nbsp&nbsp<a href="#" title="move down"><i class="entypo-down-open-big"></i></a>
                    &nbsp&nbsp<a href="#" title="move up"><i class="entypo-up-open-big"></i></a>
                    &nbsp&nbsp<a href="#" title="delete" onclick="jQuery('#modal-confirm-delete').modal('show', {backdrop: 'static'});"><i class="entypo-cancel"></i></a>
                </td>
            </tr>
        }
    </tbody>
</table>

这是我的控制器动作

[Route("{id:int:min(1)}/addDesign")]
[HttpPost]
[ValidateAntiForgeryToken]
public async Task<ActionResult> AddDesign(Design model)
{
    //this one is empty:  model.FeaturedProductTypes
}

如何将添加到表中的每个新行绑定为模型FeaturedProductTypes属性中的项?

2 个答案:

答案 0 :(得分:0)

您需要使用正确的id / name作为模型绑定器的输入元素才能工作:

如果您自己生成输入元素:

@Html.IdFor(m => m.FeaturedProductTypes[i].Action)
@Html.NameFor(m => m.FeaturedProductTypes[i].Action)

将为您输入正确的输入标记的ID和名称,或使用以下内容生成输入标记:

@Html.EditorFor(m => m.FeaturedProductTypes[i].Action)



重要的是使用模型的索引值,例如以下将 NOT 工作:

var item = Model.FeaturedProdictTypes[i];
@Html.NameFor(m => item.Action)

因此foreach不能直接使用。

<强>更新
您的表格可以填写如下:

@for (int i = 0; i < Model.FeaturedProductTypes.Length; i++)
{
     <tr>
        <td class="vcenter">
            <a href="#" onclick="jQuery('#modal-window').modal('show', { backdrop: 'static' });">@Model.FeaturedProductTypes[i].Label</a>
        </td>
        <td class="vcenter">
            @Html.EditorFor(m => m.FeaturedProductTypes[i].Lable)
        </td>
        <td class="vcenter">
            @Html.EditorFor(m => m.FeaturedProductTypes[i].Display)
        </td>
        <td class="vcenter">
            @Html.EditorFor(m => m.FeaturedProductTypes[i].Count)
        </td>
        <td class="vcenter">
            @Html.EditorFor(m => m.FeaturedProductTypes[i].Action)
        </td>
        <td class="vcenter text-right">
            &nbsp&nbsp<a href="#" title="move down"><i class="entypo-down-open-big"></i></a>
            &nbsp&nbsp<a href="#" title="move up"><i class="entypo-up-open-big"></i></a>
            &nbsp&nbsp<a href="#" title="delete" onclick="jQuery('#modal-confirm-delete').modal('show', {backdrop: 'static'});"><i class="entypo-cancel"></i></a>
        </td>
    </tr>
}

答案 1 :(得分:0)

添加到您的班级;

public class Design
{
    public Featuredproducttype[] FeaturedProductTypes { get; set; } 
    public Featuredproducttype AddedItem { get; set; }
}

然后将其与模型属性AddedItem绑定。现在,您可以将新项添加到AddedItem数组中:

[Route("{id:int:min(1)}/addDesign")]
[HttpPost]
[ValidateAntiForgeryToken]
public async Task<ActionResult> AddDesign(Design model)
{
    List<FeaturedProductTypes> productCollection = model.FeaturedProductTypes.ToList();
    productCollection.Add(model.AddedItem);
    model.FeaturedProductTypes = productCollection.ToArray();
    //do something more
}