1

私は、jQuery UI の datepicker 用の Trent Richardson の優れた Datetimepicker プラグインを使用しています。

ただし、解決したい問題の 1 つは、フィールドを選択してナビゲートすると、入力フィールドの日付値が変化するという事実です。そのため、日付を選択してから、他のオプションを表示するためにナビゲートすることにした場合、プロセス中に日付が変更されます。

例として、こちらの例のページをご覧ください(スライダーの代わりにドロップダウンを使用)。

ここに私の初期化コードがあります:

$('input[name=valueTextField]').addClass('datepicker');

                $( ".datepicker" ).datetimepicker({
                        dateFormat: 'm/d/yy ',
                        timeText: 'Test',
                        controlType: 'select',
                        timeFormat: "h:mm TT",
                        ampm: true,
                        onChangeMonthYear: function(year, month, dpInst, tpInst) {
                            alert(dpInst);
                            alert(dpInst.dateDefined);
                            if(!tpInst.timeDefined && !dpInst.dateDefined) {
                                this.value = '';
                                dpInst.dateDefined = null;
                            }
                            if (dpInst.dateDefined) {

                            }
                        },
                        onSelect: function(date, dpInst) {
                            dpInst.dateDefined = true;
                        }

                });
                $("#ui-datepicker-div").addClass("meta_datepicker");
                $('input[name=valueTextField]').attr('readonly', 'readonly');

ここで JSFiddle を確認できます。

4

1 に答える 1

1

keyupそれぞれとの後に前の値を保存し、またはselectの間にそれを復元することができます：changeMonthYearclose

$( ".datepicker" ).datetimepicker({
    ...
    onSelect: function() {
        $(this).data("oldValue",this.value);
    },
    onChangeMonthYear: function(year, month, dpInst, tpInst) {
        this.value = $(this).data("oldValue");
    },
    onClose: function() {
        this.value = $(this).data("oldValue");
    }
}).keyup(function() {
    $(this).data("oldValue",this.value);
});

実例。_ きれいではありませんが、仕事は終わります...いくつかのエッジケース：

  • ポップアップをナビゲートしている間、すべてが正常に機能しますが、テキストフィールドを編集しようとすると、現在の月に戻ります（実際には問題ありません）。
  • マウスを使用してテキストフィールドに日付を貼り付け、すぐに[次へ]または[前へ]をクリックすると、正しい値が保持されません（ただし、そのための簡単なクロスブラウザソリューションはわかりません）。
  • 月を変更してから時刻を選択すると、@ streetlightで指摘されているように、日付も現在の月に変更されます。これを防ぐために、カスタムをcontrolType使用することもできますが、完全な実装はこの回答の範囲を超えています。

更新： @streetlightがさらに別の問題を指摘したように、[今]ボタンを使用すると、すべてが「グリッチ」になります（古い値を使用する場合もあれば、新しい値を使用する場合もあります）-これは手間がかかりすぎるという結論に達しましたユーザーコードで行います。実際、カレンダーのナビゲート中に値を自動的に変更しない方が使い勝手が良いと仮定すると、このオプションを提案するためにjQueryチームでRFEを開くことをお勧めします。

于 2012-11-27T17:16:02.753 に答える