0

JSP に次のコードがあり、変数をノックアウト js にバインドします。

私のjsは

 calender: function () {
     console.log("in calender");
     var dates = $("#from1, #to1").datepicker({
     defaultDate: "+1w",
     changeMonth: true,
     numberOfMonths: 1,
     onSelect: function (selectedDate) {
         var option = this.id == "from" ? "minDate" : "maxDate",
             instance = $(this).data("datepicker"),
             date = $.datepicker.parseDate(
             instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings);
         dates.not(this).datepicker("option", option, date);
     }
 });
 },

そしてjspは

 <div class="DateRange">
 <label for="from">From</label>
 <input type="text" id="from" name="from" data-bind="click: calender, value:    starDate"/>
 <label for="to">to</label>
 <input type="text" id="to" name="to" data-bind="click: calender, value: endDate"/>
 </div>

開始日または終了日のいずれかをクリックするとカレンダーメソッドが呼び出されますが、ID に関係なく、最初のコンポーネントで最初のクリック (メソッドのみが呼び出される) に対して日付ピッカーが表示されないという問題があります。2番目のコンポーネントを次にクリックすると、日付ピッカーのみが正常に表示されます。私がここで見逃しているものはありますか？

4

2 に答える 2

0

簡単に言うと 1. datapicker の初期化をカレンダー メソッドの外に移動します。2. 適切な日付ピッカーを表示するフィールドごとに 2 つの個別のメソッドを作成します。

    $("#from1, #to1").datepicker({
     defaultDate: "+1w",
     changeMonth: true,
     numberOfMonths: 1,
     onSelect: function (selectedDate) {
         var option = this.id == "from" ? "minDate" : "maxDate",
             instance = $(this).data("datepicker"),
             date = $.datepicker.parseDate(
             instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings);
         dates.not(this).datepicker("option", option, date);

      }
    });    

    ........

    calenderFrom: function () {
     $("#from1").datepicker("show");
    }
    calenderTo: function () {
     $("#to1").datepicker("show");
    }

<input type="text" id="from" name="from" data-bind="click: calenderFrom, value:    starDate"/>
<input type="text" id="to" name="to" data-bind="click: calenderTo, value: endDate"/>

UPD jQueryUI datepicker を使用していると仮定します。その場合は、手動で表示する必要はありません。初期化するだけ

于 2012-04-11T15:41:46.177 に答える
0

初めてカレンダーメソッドを通過するまで、入力は実際には datapicker() ではないため、起動していません。入力を 2 回目にクリックすると、カレンダー メソッドの最初のパスで設定されているため、データ ピッカーになります。

calendar メソッドを使用する代わりに、これを実行してみませんか。

$("#from1, #to1").datepicker({...});
于 2012-04-11T15:43:37.980 に答える