0

私は非常にシンプルなものを探していますが、ここやブートストラップのdatetimepickerのドキュメントでも見つけられませんでした。ブートストラップデータピッカーの関数でmaxDateまたはminDateを設定する方法はありますか?

アイデアは非常に簡単です。私は現在、サーバーから取得したpage_loadに値を持つ2つのdatetimeフィールドを持っています。

ここでは、最初の日付のmaxDateが2番目の日付値で、2番目の日付のminDateが最初のフィールドの日付であることを確認します。

は、ここに私のコードです:

$(document).ready(function() { 
$('[id^="datetimepickerStartDate"]').datetimepicker({ 
    useCurrent: false, 
    format: applicationDateTimeFormat, 
    ignoreReadonly: true, 
    //maxDate: function() { 
    // var id = $(this).attr('id'); 
    // var str = id.split("_"); 
    // if (str.length <= 1) { 
    //  var secondDateTimePicker1 = $('#datetimepickerFinishDate').data("DateTimePicker").date(); 
    //  if (secondDateTimePicker1.length) { 
    //   return secondDateTimePicker1; 
    //  } 
    //  return null; 
    // } else { 
    //  var secondDateTimePicker2 = $("#datetimepickerFinishDate_" + str[1]).data("DateTimePicker").date(); 
    //  if (secondDateTimePicker2.length) { 
    //   return secondDateTimePicker2; 
    //  } 
    //  return null; 
    // } 
    //}, 
    locale: locale 
}); 
$('[id^="datetimepickerFinishDate"]').datetimepicker({ 
    useCurrent: false, 
    format: applicationDateTimeFormat, 
    ignoreReadonly: true, 
    //minDate: function() { 
    // var id = $(this).attr('id'); 
    // var str = id.split("_"); 
    // if (str.length <= 1) { 
    //  var secondDateTimePicker1 = $('#datetimepickerStartDate').data("DateTimePicker").date(); 
    //  if (secondDateTimePicker1.length) { 
    //   return secondDateTimePicker1; 
    //  } 
    //  return null; 
    // } else { 
    //  var secondDateTimePicker2 = $("#datetimepickerStartDate_" + str[1]).data("DateTimePicker").date(); 
    //  if (secondDateTimePicker2.length) { 
    //   return secondDateTimePicker2; 
    //  } 
    //  return null; 
    // } 
    //}, 
    //minDate: new Date().setHours(0, 0, 0, 0), 
    locale: locale 
}); 
$('[id^="datetimepickerStartDate"]') 
    .on("dp.change", 
    function (e) { 
     var id = $(this).attr('id'); 
     var str = id.split("_"); 
     if (str.length <= 1) { 
      $('#datetimepickerFinishDate').data("DateTimePicker").minDate(e.date); 
     } else { 
      $("#datetimepickerFinishDate_" + str[1]).data("DateTimePicker").minDate(e.date); 
      $(id).datetimepicker('hide'); 
     } 
    }); 

$('[id^="datetimepickerFinishDate"]') 
    .on("dp.change", 
    function (e) { 
     var id = $(this).attr('id'); 
     var str = id.split("_"); 
     if (str.length <= 1) { 
      $('#datetimepickerStartDate').data("DateTimePicker").maxDate(e.date); 
     } else { 
      $("#datetimepickerStartDate_" + str[1]).data("DateTimePicker").maxDate(e.date); 
      $(id).datetimepicker('hide'); 
     } 
     $(id).datetimepicker('hide'); 
    }); 
}); 

そのコードが、私は探していますの多くは、私がのDateTimePickerの最初のオープンで、これらのルールを設定することができますどのような方法です。だから、私はmaxDateとminDateプロパティのe関数を実行すると思っていましたが、うまくいきませんでした!

どのようにすればこの問題を解決できますか?

dp.changeイベントは日付が初めて変更された場合にのみ動作します...

答えて

0

あなたはオーバー錯体形成、これをしている、あなたが探していることは基本的には次のとおりです。 1)最初のピッカーのためmaxDateのです第2のピッカーで選択されたもの。 2)2番目のピッカーで選択されるminDateは、最初のピッカーを持つものです。

ので、公式ページの例のようにあります:http://eonasdan.github.io/bootstrap-datetimepicker/#linked-pickers

しかし、あなたはあなたのページの負荷の値を持っているとして、私はこの一般的なスクリプトを持っている:だから何そのすべて

function AplicarLinkedDatePicker() { 
    var $Min = $('.datetimepickerMin'); 
    var $Max = $('.datetimepickerMax'); 

    var valInputMax = $Max.children(':input').val(); 
    var valInputMin = $Min.children(':input').val(); 

    var format = 'DD/MM/YYYY'; 

    $Min.datetimepicker({ 
     format: format, 
     useCurrent: false, 

    }); 

    $Max.datetimepicker({ 
     format: format, 
     useCurrent: false, 
    }); 

    $Min.on("dp.change", function (e) { 
     $Max.data("DateTimePicker").minDate(e.date); 
    }); 

    $Max.on("dp.change", function (e) { 
     $Min.data("DateTimePicker").maxDate(e.date); 
    }); 

    if (valInputMin != null) { 
     $Max.data("DateTimePicker").minDate(moment(valInputMin, format).startOf('day')); 
    } 

    if (valInputMax != null) { 
     $Min.data("DateTimePicker").maxDate(moment(valInputMax, format).endOf('day')); 
    } 


} 

を上記は何ですか? doesは、pickがピッカーに関連する値を持っているかどうかをチェックし、それぞれのminDateとmaxDateを設定します。そうでない場合、デフォルトで無視されます。

関連する問題