0

を使用して依存datepickersを作成します。日付のピッカーの前の日付は、2番目に無効にされた最初のものです。私は最初の日付ピッカーで選択されたその日が第二の開始日として使用されます<a href="https://github.com/uxsolutions/bootstrap-datepicker" rel="nofollow noreferrer">https://github.com/uxsolutions/bootstrap-datepicker</a>によって日付ピッカーを使用して2つの日付ピッカーを作成する必要があり、ブートストラップ、DatePickerの

最初の日付ピッカーのためのHTML:

<div class="col-sm-6 row-margin" id="div-last-day"> 
<div class="input-group date"> 
<input type="text" class="test-width form-control input-xs" name="last-day-worked" id="last-day" placeholder="Select your last Date" readonly><span class="input-group-addon input-xs"><i class="glyphicon glyphicon-calendar"></i></span> 

セカンド日付ピッカー:ここ

<div class="col-sm-6 row-margin" id="div-separation-day"> 
    <div class="input-group date"> 
     <input type="text" class="test-width form-control input-xs" name="separation-day-worked" id="separation-day" placeholder="Select your Separation Date" readonly><span class="input-group-addon input-xs"><i class="glyphicon glyphicon-calendar"></i></span> 
</div> 
    </div> 

は私のコードの一部です:

$("#div-last-day .input-group.date").datepicker({ 
      format: "dd-M-yyyy", 
      todayHighlight: true, 
      autoclose: true, 
     }); 
     $('#div-last-day .input-group.date').datepicker() 
     .on('changeDate', function (e) { 
      var lastdate = $('#div-last-day .input-group.date').datepicker('getDate'); 
      var date = new Date(lastdate); 
      var curr_date = date.getDate(); 
      var curr_month = date.getMonth(); 
      var curr_year = date.getFullYear(); 
      perfect_date = curr_date + "-" + m_names[curr_month] 
      + "-" + curr_year; 
      $("#div-separation-day .input-group.date").datepicker({ 
       format: "dd-M-yyyy", 
       todayHighlight: true, 
       startDate: perfect_date, 
       autoclose: true, 
      }); 
     }); 

H私は作業中のフィドルですhttps://jsfiddle.net/5tpn12L8/

フィドルは初めてですが、最初の日付ピッカーで日付を変更すると、2番目の日付ピッカーが更新されません。

+0

? – Pawan

+0

2番目の日付ピッカーは、選択した日付の最初の日付からのみ日付を許可します。 –

答えて

0

として使用することができる独自のドキュメントのしている:

HTML:

<input class="form-control" id="txtFromDate" /> 
<input class="form-control" id="txtToDate" /> 

のjQuery:

datepickersが依存しているか

jsfiddle DEMO

+0

それは..働いていただきありがとうございます。 –

+0

歓迎.....;) – Pawan

0

実際timepickerが、それはあなたが以下のようにそれを行うことができますが、

$('#timepicker_input').datetimepicker({ 
    format: "dd-M-yyyy", 
    todayHighlight: true, 
    autoclose: true, 
    onSelect: function(dateText, inst){ 
     //here perform the change you want 
    } 
}); 
関連する問題