从 json 构建表单答案

【问题标题】：Building a form from json从 json 构建表单
【发布时间】：2011-08-24 17:31:14
【问题描述】：

我正在使用 jquery+json 从我的控制器中获取一组视图模型。然后我构建了一个表格，其中表格中的每一行代表一个视图模型。

我的问题是：我应该如何命名每个表单元素，以便我可以将它用于我的控制器操作，如下所示：

public ActionResult Update(MyViewModel[] models)
{
}

编辑：我正在使用 jquery-tmpl 生成表单，并且我也在尝试弄清楚如何在其中获取索引变量（如果生成表单需要的话）。

【问题讨论】：

标签： asp.net-mvc forms model-binding

【解决方案1】：

我设法让它工作。

我的 jquery 模板：

<script id="wagonTemplate" type="text/x-jquery-tmpl">
    <tr>
        <td>
            <input type="checkbox" value="true" class="wagoncheck" name="wagons[${$item.getIndex()}].IsSelected" />
        </td>
        <td>
            <input type="text" name="wagons[${$item.getIndex()}].WagonId" value="${WagonId}" style="width:120px" />
        </td> 
        <td>
            <input type="text" name="wagons[${$item.getIndex()}].WagonNumber" value="${WagonNumber}" style="width:20px" />
        </td> 
</script>

加载模板的方法：

function loadWagons(trainId, partId) {
    $.getJSON('/train/wagons/' + escape(trainId) + '?partNo=' + partId, function (data) {
        $wagons = $('#wagons tbody');
        $wagons.empty();

        // the function used in the template to get an index.
        var tmplOptions = {
            getIndex: function getIndex() {
                return $.inArray(this.data, data);
            }
        };
        $("#wagonTemplate").tmpl(data, tmplOptions).appendTo($wagons);
    });
}

换句话说：

要在控制器操作中获取 YourModel[] items 参数，您需要将项目命名为 items[0].MyProperty' where0` 应该对应于数组中的索引。

要在 jquery 模板中获取索引，只需将选项中的方法传递给模板函数。我正在使用here 找到的答案的略微修改版本。没有必要按照该答案中的方式传递该项目，因为this 指向当前项目。

【讨论】：