如何在daterangepicker中禁用过去的日期?

时间:2016-06-21 13:48:07

标签: daterangepicker

我使用了两个日期选择的daterangepicker。这个工作完美,但如何禁用过去的日期。下面是我的代码

JS /站点/日期范围/ moment.min.js">
    <script type="text/javascript" src="<?php echo base_url();?>js/site/daterange/daterangepicker.js"></script>
    <link rel="stylesheet" type="text/css" href="<?php echo base_url();?>css/site/daterangepicker.css" />
    <script type="text/javascript">
      $(function() {
      $('input[name="checkin"],input[name="checkout"]').daterangepicker({
          autoUpdateInput: false,
          locale: {
              cancelLabel: 'Clear'
          }
      });

      $('input[name="checkin"],input[name="checkout"]').on('apply.daterangepicker', function(ev, picker) {
          //$(this).val(picker.startDate.format('MM/DD/YYYY') + ' - ' + picker.endDate.format('MM/DD/YYYY'));
          $('#checkin').val(picker.startDate.format('MM/DD/YYYY'));
          $('#checkout').val(picker.endDate.format('MM/DD/YYYY'));

      });

      $('input[name="checkin"],input[name="checkout"]').on('cancel.daterangepicker', function(ev, picker) {
          $(this).val('');
      });

      });

3 个答案:

答案 0 :(得分:7)

我有同样的问题。我检查了http://www.daterangepicker.com/#options,在我看来minDate会做这个工作。

    var today = new Date(); 
    var dd = today.getDate(); 
    var mm = today.getMonth()+1; //January is 0! 
    var yyyy = today.getFullYear(); 
    if(dd<10){ dd='0'+dd } 
    if(mm<10){ mm='0'+mm } 
    var today = dd+'/'+mm+'/'+yyyy; 
    $('input[name="daterange"]').daterangepicker({

             minDate:today
    });

答案 1 :(得分:2)

因此,我可以从您的代码中看到您想要禁用过去的日期,因此有多种方法可以执行此类操作,但在我看来,最简单的方法是获取文档的当前日期加载并将其设置为日期范围选择器的开始日期。

http://www.daterangepicker.com/#options应该为您提供解释startDate语法的示例以执行相同操作,并且以上述格式查找当前日期的代码可以显示如下:

var today = new Date(); 
var dd = today.getDate(); 
var mm = today.getMonth()+1; //January is 0! 
var yyyy = today.getFullYear(); 
if(dd<10){ dd='0'+dd } 
if(mm<10){ mm='0'+mm } 
var today = dd+'/'+mm+'/'+yyyy; 

今天在这里存储您需要的格式的字符串形式,并且可以设置为startDate属性。

答案 2 :(得分:2)

这是解决问题的简便方法

$('input[name="daterange"]').daterangepicker({
      minDate:new Date()
});