3

いくつかの異なる場所で日付ピッカー機能を使用するプランナーを構築しています。カレンダーを制御する一般的な日付ピッカーがあり、さまざまなダイアログで、フィールドの日付 (イベントの開始日など) を選択するためだけに日付ピッカーを開くためのボタンが必要です。

一般的な日付ピッカーは div に関連付けられています (つまり、インラインの日付ピッカーです) が、他の日付ピッカーは入力に関連付けられています。1 つの日付ピッカーを div に結び付けているのには十分な理由があります。ドラッグ可能およびドロップ可能を使用して項目をドラッグできるようにする必要がありますが、「ポップアップ」日付ピッカーを使用すると不可能であることが判明しました。

さて、ExpertsExchange の投稿で、datepicker インスタンスを 1 つ初期化すると、後のインスタンスに指定しない限り、そのオプションが他のインスタンスに自動的に適用されることを見てきました。しかし、私の場合、すべてが絡み合っているようです.1つのアイテムに指定されたイベントが別のアイテムで発生し、ポップアップの日付ピッカーを閉じた後にインラインの日付ピッカーが表示されるなど.

たくさんあるので、まだ実際のコードは含めていません。まず、「Datepicker では、1 つのオプションがインスタンスごとに異なる値を持つことを許可していないため、... 」または「インラインとポップアップの日付ピッカーを混在させないでください...」など。

しかし、codespeak での私の一般的な考えは次のとおりです。

$('div#mainDatePicker').datepicker({
  //options for main (inline) datepicker, doubling as defaults for any subsequent datepickers
})

$('input#selectStartDate').datepicker({
  //specific options for this datepicker, where different from the main one
})

助けてくれてありがとう！

ウィッツェ

4

4 に答える 4

3

使えばうまくいき$('.someclass).datepicker();ます$('.anotherclass).datepicker()。

使用する場合:

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

これは機能しません。

アレックスPが言ったことは起こります。

問題を解決するには、ID を使用する必要があります。他に方法はありません。

使用するIDは問いません。ランダムに生成された一意の ID を使用できます。以下に例を示します。

$('.someclass').each(function() {
   $('#' + $(this).attr('id')).datepicker();
});
于 2013-06-07T21:49:28.893 に答える
2

同じページで複数の日付ピッカーを使用していくつかの作業を行ったところ、各日付ピッカーに一意の ID が必要であることに気付くまで、予期しない結果が得られました。

たとえば、datepicker を 2 つの類似した入力ボタンにバインドするとします。次の場合、問題が発生します。

<input type="text" class="myCustomDatePicker">
<input type="text" class="myCustomDatePicker">

たとえば、2 番目の DatePicker を使用して日付を設定すると、選択した日付が最初の入力ボックスの入力フィールドに表示されます。

代わりに、を設定するidと、各日付ピッカーが個別に機能することが保証されます。

<input type="text" class="myCustomDatePicker" id="dp1">
<input type="text" class="myCustomDatePicker" id="dp2">

これが役立つかどうかはわかりませんが、同じページで複数の日付ピッカーを使用する場合にチェックするべきことです

于 2010-11-25T13:23:36.083 に答える
1

jQuery UI Datepicker ウィジェットは、それをアタッチする html 属性の ID を参照します。したがって、複数の日付ピッカーを使用するには、各日付ピッカーの ID が異なることを確認する必要があります。

So you want to end up with the following HTML:

<input id="form-date-1" type="text" />
<input id="form-date-2" type="text" />
<script type="text/javascript">
  $("#form-date-1").datepicker();
  $("#form-date-2").datepicker();
</script>

この記事をチェックしてください：http://mike-abner.posterous.com/multiple-jquery-ui-datepickers-on-the-same-pa

于 2011-07-25T09:50:39.473 に答える
0

私はこの問題を一度（日付形式のために）持っていました。たぶん、次のようにクリックしてバインドできます：

$('div#mainDatePicker').click(function(){
    $(this).datepicker({
        //options for main (inline) datepicker, doubling as defaults for any subsequent datepickers
    })
})

$('input#selectStartDate').click(function(){
    $(this).datepicker({
        //specific options for this datepicker, where different from the main one datepickers
    })
})
于 2010-11-25T10:27:58.467 に答える