0

次のように、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" });
});

日付ピッカーはすべて、各テキストボックスの正しい位置で正しく起動します。しかし、それらのいずれかから日付を選択すると、最初のテキストボックスにのみ入力されます。各日付ピッカーがテキストボックスにしっかりと関連付けられていることを確認するにはどうすればよいですか?

4

1 に答える 1

2

すべてのテキストボックス()に同じIDを使用しているようですが、id="thingStartDate"これは明らかに無効な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>
于 2012-07-26T16:24:28.780 に答える