Question

我正在尝试使用kendo ui mvc包装器网格绑定到对象列表。

此外，我在每行的第一列添加一个复选框，网格是表单中的包装器。然后我想在提交时利用（顺序或非顺序）列表的默认模型绑定。

我遇到的问题是编写索引的 HiddenFor 和 CheckBoxFor 辅助方法。

如果我自己编写表格布局，那就是这样的：

<table>
    <tbody>
        @for (var i = 0; i < Model.Count; i++)
        {
            <tr>
                <td>
                    <input type="hidden" name="Index" autocomplete="off" value="@i" />
                    @Html.HiddenFor(m => Model[i].Id)
                    @Html.CheckBoxFor(m => Model[i].Selected)
                </td>
                ...

这会产生以下HTML输出。

<input type="hidden" name="Index" autocomplete="off" value="0" />
<input id="[0].Id" name="[0].Id" type="hidden" value="1234" />
<input id="[0].Selected" name="[0].Selected" type="checkbox" value="true" />
<input name="[0].Selected" type="hidden" value="false" />

如何使用kendo ui mvc网格包装器进行服务器侧绑定？

我尝试使用在网格外定义的计数器并在.RowAction和绑定列内增加它，但是混合的结果没有给我所需的结果。

var counter = 0;
@(Html.Kendo().Grid(Model)
    .Name("grid")
    .Columns(columns =>
    {
        columns.Bound(c => c.Id)
            .Template(
                @<text>
                    <input type="hidden" name="Index" autocomplete="off" value="@counter" />
                    @Html.HiddenFor(m => Model[counter].Id)
                    @Html.CheckBoxFor(m => Model[counter].Selected)
                </text>)
                ...

我遇到的问题是增加计数器。也许有更好的解决方案？

我做的另一个尝试是自己编写表格html，然后应用javascript网格绑定$（“grid”）。kendoGrid（...）。但是，我失去了动态定义tr / td元素上的css类的能力。

Answer 1

尝试这样（未经测试）：

var counter = -1;
@(Html.Kendo().Grid(Model)
    .Name("grid")
    .Columns(columns =>
    {
        columns
            .Bound(c => c.Id)
            .Template(
                @<text>
                    @{counter++;}
                    <input type="hidden" name="Index" autocomplete="off" value="@counter" />
                    @Html.HiddenFor(m => m[counter].Id)
                    @Html.CheckBoxFor(m => m[counter].Selected)
                </text>);

        ... some other columns
    }
)

如何将kendo ui mvc grid绑定到对象列表

1 个答案: