如何在bootstrap中设置datetimepicker的MinDate和maxDate属性

Question

我想在bootstrap中为datetimepicker动态设置minDate和maxDate属性,请帮我解决这个问题.

在这种情况下,当在一个datetimepicker中选择日期时,它应该将所选日期设置为其他datetimepicker的minDate.

在第二个datetimepicker中选择日期后,其所选日期应在第一个日期时间选择器中变为maxDate.

我试过这样的方式:

$(document).ready(function(){
      $(".form_datepicker_startdate").datetimepicker({         
       isRTL: App.isRTL(),
                format: "yyyy-mm-dd",
                weekStart: 1,
                todayBtn:  1,
          autoclose: 1,
          todayHighlight: 1,
          startView: 2,
          minView: 2,
          startDate:'<%= request.getSession().getAttribute("startdate") %>',
          endDate:'<%= request.getSession().getAttribute("enddate") %>',
          forceParse: 0,
                pickerPosition: (App.isRTL() ? "bottom-right" : "bottom-left")          
           }).on('changeDate', function (selected) {
                var minDate = new Date(selected.date.valueOf());
                $('.form_datepicker_enddate').datepicker('setMinDate', minDate);
            });


$(".form_datepicker_enddate").datetimepicker({         
       isRTL: App.isRTL(),
                format: "yyyy-mm-dd",
                weekStart: 1,
                todayBtn:  1,
          autoclose: 1,
          todayHighlight: 1,
          startView: 2,
          minView: 2,
          startDate:'<%= request.getSession().getAttribute("startdate") %>',
          endDate:'<%= request.getSession().getAttribute("enddate") %>',
          forceParse: 0,
                pickerPosition: (App.isRTL() ? "bottom-right" : "bottom-left")          
           }).on('changeDate', function (selected) {
                var maxDate = new Date(selected.date.valueOf());
                $('.form_datepicker_startdate').datepicker('setMaxDate', maxDate);
            });
     });

Answer 1

限制Botstrap datepicker,我找到的最简单的方法是:

$("#datepicker").datepicker({

  maxDate : 'now'

});

这将禁用比今天更大的日期.

Answer 2

我假设您正在使用代码片段中提供的代码中的此插件.假设这是您尝试在应用程序中使用的插件,那么更新开始日期和结束日期或者可能混合来自不同库的内容是错误的方法.

在任何情况下,如果我正确理解你的问题,这里是一个jsfiddle,它可以完成你的一部分功能.

更新新的开始日期或结束日期时,要使用的语法如下(来自插件的文档):

$('#datetimepicker').datetimepicker('setStartDate', '2012-01-01');

并开始和结束日期的名称选项setStartDate并setEndDate没有的minDate和MAXDATE也用来更新它们的功能是datetimepicker不日期选择器.

以下是JS Fiddle的代码:

$(document).ready(function(){
  $("#form_datepicker_startdate").datetimepicker({
    format: "yyyy-mm-dd",
    weekStart: 1,
    todayBtn:  1,
    autoclose: 1,
    todayHighlight: 1,
    startView: 2,
    minView: 2,
    startDate : new Date('2012-08-08'),
    endDate : new Date('2014-08-08'),
}).on('changeDate', function (selected) {
    var minDate = new Date(selected.date.valueOf());
    $('#form_datepicker_enddate').datetimepicker('setStartDate', minDate);
});

  $("#form_datepicker_enddate").datetimepicker();
 });

希望它有所帮助,让我知道我在任何地方的假设是否错误.