0

我有一个呈现可编辑数据表的视图。该页面具有 Ajax 控件，允许您在表格中添加和删除单行。我使用强类型视图来完成此操作，该视图具有派生自 IEnumerable 的模型。在视图中，它遍历模型中的每个项目，并使用对该对象进行强类型化的局部视图来呈现它。这样，控制器可以使用父视图来渲染整个列表，而 Ajax 端点可以使用局部视图来渲染并返回一个表格行，以便 jQuery 插入表格。

当点击保存按钮时，jQuery 循环遍历表格，打包数据并分配序号，这样当数据 POST 到服务器时，模型绑定引擎将数据识别为IEnumerable<TimeLogEntry>.

这是我的列表视图（去掉了不必要的代码）：

@model IEnumerable<TimeTracker.Models.TimeLogEntry>

<table id="time-log">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.FirstOrDefault().StartTime)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.FirstOrDefault().EndTime)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.FirstOrDefault().Description)
            </th>
        </tr>
    </thead>

    <tbody>
        foreach (var item in Model.OrderByDescending(entry => entry.StartTime))
        {
            Html.RenderPartial("~/Views/TimeLog/_EditEntry.cshtml", item);
        }
    </tbody>
</table>

以及显示一个单一的部分视图TimeLogEntry：

@model TimeTracker.Models.TimeLogEntry

<tr id="@Model.TimeLogEntryId">
    <td class="no-wrap">
        @Html.EditorFor(model => model.StartTime)
        @Html.ValidationMessageFor(model => model.StartTime)
    </td>
    <td class="no-wrap">
        @Html.EditorFor(model => model.EndTime)
        @Html.ValidationMessageFor(model => model.EndTime)
    </td>
    <td>
        @Html.EditorFor(model => model.Description)
        @Html.ValidationMessageFor(model => model.Description)
    </td>
</tr>

此代码无法正确验证，因为呈现它的部分视图与该项目来自的 IEnumerable 是分开的，因此不知道它是在 foreach 循环的上下文中执行的。因此，每个表行中的元素将具有相同的名称和 ID，这会导致客户端验证出现问题。例如，所有StartTime文本框的 ID 都是StartTime, 而不是[0].StartTime,[1].StartTime等。EditorFor 方法无法设置idordata-valmsg-for属性。如何使每个文本框id属性唯一，并且data-valmsg-for每个验证消息上的属性与其对应的文本框 ID 匹配？我应该这样做还有另一种更好的方法吗？

4

1 回答 1

0

您可以将视图重新定义为（不使用部分）

@model IEnumerable<TimeTracker.Models.TimeLogEntry>
<table id="time-log">
    ...other stuff that you want to add 
    <tbody>
        @{var itemList = Model.OrderByDescending(entry => entry.StartTime).ToList(); }
        @for(var index =0 ; index < itemList.Count;index ++)
        {
           <tr id="@Model.TimeLogEntryId">
             <td class="no-wrap">
                @Html.EditorFor(model => model[index].StartTime)
                @Html.ValidationMessageFor(model => model[index].StartTime)
            </td>
            <td class="no-wrap">
               @Html.EditorFor(model => model[index].EndTime)
               @Html.ValidationMessageFor(model => model[index].EndTime)
            </td>
            <td>
               @Html.EditorFor(model => model[index].Description)
               @Html.ValidationMessageFor(model => model[index].Description)
            </td>
          </tr>
        }
    </tbody>
</table>
于 2012-12-27T22:02:32.397 回答