在jQuery UI Datepicker中将第二个日期限制为+天

时间:2016-11-23 15:16:40

标签: javascript jquery jquery-ui jquery-ui-datepicker

之前标记为重复,我没有得到任何答案。这不是重复,所以请不要将其标记为,另一篇文章与第一个选择中的第二个日期限制为当前所选日期有关,我没有尝试那样做,已经有了。我试图在第二个日历/日期添加+ 3天。因此,如果我今天在第一个日期和第二个日期选择,我将无法选择该日期+ 3天的日期。

示例:从日期是2016年12月21日,然后在第二个字段中,我无法选择更早的日期,而不是2016年12月24日。

我在datepicker中遇到日期范围问题。我需要" carrental_to_date"在所选" carrental_from_date"之后至少3天但似乎没什么用。

我尝试过更改" minDate"在" to_date"到" + 3d"但它似乎没有选择,我确实在这里找到了一个例子:http://jsfiddle.net/jquerybyexample/dxbtp/494/但我也无法做到这一点。不知道我在这里做错了什么,并希望你们中的一个天才能够指出我正确的方向。

jQuery('#carrental_from_date' + element_id).datepicker({
            //showOn: "both",
            beforeShow: carrental_customRange,
            dateFormat: "<?php echo date_format_js(isset($theme_options['date_format']) ? $theme_options['date_format'] : ''); ?>",
            firstDay: "<?php echo (isset($theme_options['date_format_first_day']) ? (int) $theme_options['date_format_first_day'] : 0); ?>",
            dayNamesMin: ["<?php echo CarRental::t('Su') ?>", "<?php echo CarRental::t('Mo') ?>", "<?php echo CarRental::t('Tu') ?>", "<?php echo CarRental::t('Wu') ?>", "<?php echo CarRental::t('Th') ?>", "<?php echo CarRental::t('Fr') ?>", "<?php echo CarRental::t('Sa') ?>"],
            monthNames: ["<?php echo CarRental::t('January') ?>", "<?php echo CarRental::t('February') ?>", "<?php echo CarRental::t('March') ?>", "<?php echo CarRental::t('April') ?>", "<?php echo CarRental::t('May') ?>", "<?php echo CarRental::t('June') ?>", "<?php echo CarRental::t('July') ?>", "<?php echo CarRental::t('August') ?>", "<?php echo CarRental::t('September') ?>", "<?php echo CarRental::t('October') ?>", "<?php echo CarRental::t('November') ?>", "<?php echo CarRental::t('December') ?>"],
            dayNames: ["<?php echo CarRental::t('Sunday') ?>", "<?php echo CarRental::t('Monday') ?>", "<?php echo CarRental::t('Tuesday') ?>", "<?php echo CarRental::t('Wednesday') ?>", "<?php echo CarRental::t('Thursday') ?>", "<?php echo CarRental::t('Friday') ?>", "<?php echo CarRental::t('Saturday') ?>"],
            nextText: "<?php echo CarRental::t('Next') ?>",
            prevText: "<?php echo CarRental::t('Prev') ?>",
            minDate: 0,
            onSelect: function() {
                carrental_update_business_hours(element_id);
            }
        });

        jQuery('#carrental_to_date' + element_id).datepicker({
            //showOn: "both",
            beforeShow: carrental_customRange,
            dateFormat: "<?php echo date_format_js(isset($theme_options['date_format']) ? $theme_options['date_format'] : ''); ?>",
            firstDay: "<?php echo (isset($theme_options['date_format_first_day']) ? (int) $theme_options['date_format_first_day'] : 0); ?>",
            dayNamesMin: ["<?php echo CarRental::t('Su') ?>", "<?php echo CarRental::t('Mo') ?>", "<?php echo CarRental::t('Tu') ?>", "<?php echo CarRental::t('Wu') ?>", "<?php echo CarRental::t('Th') ?>", "<?php echo CarRental::t('Fr') ?>", "<?php echo CarRental::t('Sa') ?>"],
            monthNames: ["<?php echo CarRental::t('January') ?>", "<?php echo CarRental::t('February') ?>", "<?php echo CarRental::t('March') ?>", "<?php echo CarRental::t('April') ?>", "<?php echo CarRental::t('May') ?>", "<?php echo CarRental::t('June') ?>", "<?php echo CarRental::t('July') ?>", "<?php echo CarRental::t('August') ?>", "<?php echo CarRental::t('September') ?>", "<?php echo CarRental::t('October') ?>", "<?php echo CarRental::t('November') ?>", "<?php echo CarRental::t('December') ?>"],
            dayNames: ["<?php echo CarRental::t('Sunday') ?>", "<?php echo CarRental::t('Monday') ?>", "<?php echo CarRental::t('Tuesday') ?>", "<?php echo CarRental::t('Wednesday') ?>", "<?php echo CarRental::t('Thursday') ?>", "<?php echo CarRental::t('Friday') ?>", "<?php echo CarRental::t('Saturday') ?>"],
            nextText: "<?php echo CarRental::t('Next') ?>",
            prevText: "<?php echo CarRental::t('Prev') ?>",
            minDate: 0,
            onSelect: function() {
                carrental_update_business_hours(element_id);
            }
        });

1 个答案:

答案 0 :(得分:1)

来自minDate的API:

  

最短可选日期。设置为null时,没有最小值。   支持多种类型:

     

日期:包含最短日期的日期对象。

     

数量:从今天开始的几天。例如,2代表从今天开始的两天,-1代表昨天。

     

字符串:由dateFormat选项定义的格式的字符串,或相对日期。相对日期必须包含价值和期间对;有效期为“y”年,“m”为数月,“w”为数周,“d”为数天。例如,“+ 1m + 7d”表示从今天起一个月零七天。

我建议使用String方法:+3d。在“发件人”字段中选择日期后,您可以将该值设置为“收件人”字段的日期。

示例中的工作示例:http://jsfiddle.net/dxbtp/871/

<强>的jQuery

$(document).ready(function() {
  $("#txtFromDate").datepicker({
    onSelect: function(selected) {
      $("#txtToDate").datepicker("setDate", selected);
      $("#txtToDate").datepicker("option", "minDate", "+3d");
    }
  });

  $("#txtToDate").datepicker({
    onSelect: function(selected) {
      $("#txtFromDate").datepicker("setDate", selected);
      $("#txtFromDate").datepicker("option", "maxDate", "-3d")
    }
  });
});