日付範囲ピッカー - 24時間範囲選択

Question

私はブートストラップのためにDate Range Pickerプラグインを使用していますが、日付の時間範囲を最大24時間有効にする必要があります。

次の例では、私は、日付範囲を選択することができます：開始日時を選択すると

<input type="text" name="daterange" value="" /> 

<script type="text/javascript"> 
$(function() { 
    $('input[name="daterange"]').daterangepicker({ 
     timePicker: true, 
     timePickerIncrement: 30, 
     locale: { 
      format: 'MM/DD/YYYY h:mm A' 
     } 
    }); 
}); 
</script> 

を、終了日は、開始日時から24時間でなければなりません。 （終了日時を開始日時から24時間以内に制限する）

プラグインを使用してこれをどのように達成できますか？

Answer 1

私はstartdate unixのタイムスタンプからenddateをテストし、それが大きい場合は、入力された時刻から24時間に戻すoninputのイベントリスナーを作成します。スニペットもうすぐ...

$('#demo').daterangepicker({ 
 
    "linkedCalendars": false, 
 
    timePicker: true, 
 
    dateLimit: { hours: 24 }, 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-daterangepicker/2.1.25/daterangepicker.css" rel="stylesheet"/> 
 
<script type="text/javascript" src="//cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script> 
 
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/bootstrap/3/css/bootstrap.css" /> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-daterangepicker/2.1.25/daterangepicker.js"></script> 
 

 

 
<input type="text" id="demo">

EDIT：daterangepickerブートストラップすでにこの機能のための機能が組み込まれています。