Question

我在foreach中生成了几个文本框元素，如下所示：

@foreach(var thing in Model.Things)
{
    <tr>
        <td>@Html.TextBoxFor(m => thing.StartDate, new { id = "thingStartDate", @class = "thingDatePicker" })</td>
    </tr>
}

我将jQuery日期选择器附加到每个文本框中，如下所示：

$(document).ready(function(){
    $(".thingDatePicker").datepicker({ dateFormat: "mm/dd/yy" });
});

日期选择器全部在每个文本框上正确触发，位置正确。但是当我从其中任何一个中选择一个日期时，它只会填充第一个文本框。如何确保每个日期选择器与其文本框牢固关联？

Answer 1

您似乎对所有文本框（id="thingStartDate"）使用了相同的ID，这显然导致HTML无效。因此要么删除id属性，要么确保你没有得到欺骗。我可能会删除它，因为你正在使用类选择器，这个id完全没有用处：

@foreach(var thing in Model.Things)
{
    <tr>
        <td>
            @Html.TextBoxFor(
                m => thing.StartDate, 
                new { @class = "thingDatePicker" }
            )
        </td>
    </tr>
}

此外，我希望您意识到m => thing.StartDate将为这些文本框生成错误的名称。它将使用name="StartDate"而不是name="Things[xxx].StartDate"，当您尝试绑定到视图模型时，这可能会让您陷入麻烦。为此，我建议在视图中抓取foreach循环，以支持编辑器/显示模板：

@Html.editorFor(x => x.Things)

并在相应的编辑器模板（~/Views/Shared/EditorTemplates/Thing.cshtml）

内

@model Thing
<tr>
    <td>
        @Html.TextBoxFor(
            x => x.StartDate, 
            new { @class = "thingDatePicker" }
        )
    </td>
</tr>

将datepicker绑定到动态生成的文本框

1 个答案: