☰

jQuery datepicker を複数のインスタンスに適用する 質問する

tag-icon • tag-icon javascript jquery jquery-ui
jQuery datepicker を複数のインスタンスに適用する 質問する

1 つのインスタンスでは正常に動作する jQuery 日付ピッカー コントロールがありますが、複数のインスタンスで動作させる方法がわかりません。

<script type="text/javascript">
    $(function() {
        $('#my_date').datepicker();
    });
</script>

<% Using Html.BeginForm()%>
<% For Each item In Model.MyRecords%>
<%=Html.TextBox("my_date")%> <br/>
<% Next%>
<% End Using%>

For Each ループがない場合でも問題なく動作しますが、「MyRecords」コレクションに複数の項目がある場合は、最初のテキスト ボックスのみに日付ピッカーが表示されます (ID に関連付けられているため、これは当然です)。テキスト ボックスにクラスを割り当てて、次のように指定してみました。

$('.my_class').datepicker();

しかし、日付ピッカーがどこにでも表示される一方で、それらはすべて最初のテキスト ボックスを更新します。

これを機能させる正しい方法は何ですか?

ベストアンサー1

html:

<input type="text" class="datepick" id="date_1" />
<input type="text" class="datepick" id="date_2" />
<input type="text" class="datepick" id="date_3" />

脚本：

$('.datepick').each(function(){
    $(this).datepicker();
});

(よりシンプルにするために少し擬似的にコード化しました)

おすすめ記事