3

私はこれのDateTimePickerを使用します。
http://eonasdan.github.io/bootstrap-datetimepicker/Options/
は基本的に私はmaxDate: moment()を設定する、すなわちmaxDateのは今に制限する必要があります。 問題は、datePickerが開かれるまでです。maxDateはnow()ではなくなりました。 datePickerが表示されるたびにmaxDateに設定します。ブートストラップdatetimepicker - maxDateを現在の値に設定しますか?

可能であればグローバルに適用したい場合は、datetimepicker()インスタンスごとに指定しないでください。 moment.jsを使って何らかの方法で相対日付を与えることは可能ですか?

このフィドルを参照してください:
https://jsfiddle.net/0Ltv25o8/3281/
私は今にmaxDateのを設定します。ページが読み込まれてから1分後に表示されますが、矢印ボタンを使用して現在の分を選択することはできません。

+0

を参照してください。私はあなたが 'maxDateの設定以来、関連するコードスニペットを追加することをお勧め:モーメント()'(ピッカーのすべての開口部のために)将来の日付を無効にするのに十分でなければなりません。おそらく問題はあなたのコードのどこかにあります。 picker initのクラスセレクタを使用して、すべてのインスタンスのコンフィグレーションを設定したり、コンフィグオブジェクトを変数にキャッシュしたり、同じ値を繰り返す代わりに変数を使用したりすることができます。 [docs](http://momentjs.com/docs/#/manipulating/) – VincenzoC

答えて

4

どのように?

現在の日付/時刻を選択できる新しいパラメータmaxDateNow(より良い名前のための任意のアイデア)が追加されました。

$('#datetimepicker1').datetimepicker({maxDateNow: true, format:'DD/MM/YYYY HH:mm'}); 

このfiddle

2

dp.showイベントを聞くことができるので、ピッカーが表示するたびにmaxDateを現在時刻に変更できます。ここでは、コードの例:日付ピッカーのプラグインのカスタムバージョンを使用する方法について

$('#datetimepicker1').datetimepicker({ 
 
    maxDate: moment(), 
 
    format:'DD/MM/YYYY HH:mm' 
 
}).on('dp.show', function(){ 
 
    $('#datetimepicker1').data("DateTimePicker").maxDate(moment()); 
 
});
<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.css" rel="stylesheet"/> 
 
<link href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.css" rel="stylesheet"/> 
 

 
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/js/bootstrap.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script> 
 

 
<div class="form-group"> 
 
    <div class="input-group date" id="datetimepicker1"> 
 
    <input type="text" class="form-control" /> 
 
    <span class="input-group-addon"><span class="glyphicon-calendar glyphicon"></span></span> 
 
    </div> 
 
</div>

+0

おかげで説明したように、 'add' /' subtract'などを使ってモーメントオブジェクトを操作することができます。私は実際にイベントコールバックのオプションを考えました。問題は、私が今最大(max)または最小(min)として設定したい日付ピッカーごとに、どのようにグローバルに適用するのですか?私はすでに独自のデフォルトオブジェクト設定を使用しており、新しいdatepickerを作成するたびにjQuery.extendを使用しています。 – user3599803

+0

クラス・セレクターを初期コードとイベント・コールバック・コードの両方で使用できますか? – VincenzoC

+0

いいえ、私は動的に挿入されたdatepickersを持っています(ajax heavy web-app)、いくつかの入力はまだページロード時に存在しません。私は必要なすべてのdatepickerにイベントコールバックコードを追加するかもしれませんが、それは私のコードではやや乱雑です。あまりにも悪い私は今相対的な最大/最小の日付を指定することはできません。 :( – user3599803

関連する問題