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

我想在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:'', 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:'', 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); }); }); 

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

 $("#datepicker").datepicker({ maxDate : 'now' }); 

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

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

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

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

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

并且开始日期和结束日期的名称选项是setStartDatesetEndDate而不是minDate和MaxDate,用于更新它们的函数是datetimepicker而不是datepicker。

以下是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(); }); 

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

我正在使用以下Datetimepicker 站点URL,请找到以下代码以停止将来的日期选择。

 $(".datepicker").datetimepicker({ format: 'd/m/YH:i', formatTime: 'H:i', formatDate: 'd/m/Y', step: 15, maxDate: new Date(), onGenerate: function () { var leftPos = $(this).offset().left + 70 + 'px'; $('.xdsoft_datetimepicker').css({ 'left': leftPos}); } }); 

我使用Jquery UI。 它非常简单,这里是您可以在JQuery UI上使用的代码

  $("#datepicker").datepicker({ minDate : +30, maxDate : +90, dateFormat : "yy-mm-dd", });