Question

两个日期选择器，工作人员将工作日输入到datepicker 1（#from）中，然后在第二个日期输入（#to）。对于日期1，日期2必须始终在未来。不允许周末。

这个工作示例，不包括周末，并且不允许在第2天过去的日期，可以在这个小提琴中找到：

<input id="from">
<input id="to"> 

$("#from").datepicker({
    defaultDate: new Date(),
    minDate: new Date(),
    beforeShowDay: $.datepicker.noWeekends,
    onSelect: function(dateStr)
    {
        $("#to").val(dateStr);
        $("#to").datepicker("option",{ minDate: new Date(dateStr)})
    }
  });

$('#to').datepicker({
   defaultDate: new Date(),
   beforeShowDay: $.datepicker.noWeekends,
   onSelect: function(dateStr) {
     toDate = new Date(dateStr);
     fromDate = ConvertDateToShortDateString(fromDate);
     toDate = ConvertDateToShortDateString(toDate);
   }
 });

我现在需要的是，能够将第二个日期输入“锁定”到与第一个日期相同的WEEK，我想到的是maxDate，但是我只能指定任意偏移量，比如Xdays，或者具体日期。这并不好，因为人们可能会选择星期四例如，我不能再添加4天并将其设置为最大日期，因为他们可以在下周选择星期一。

那么我怎样才能将他们的约会时间限制为一周，其中那一周在第一个字段中选择的那一天设置为absed。

如果可能，请更新工作答案。感谢。

Answer 1

试用此代码

var date = $(this).datepicker('getDate');
endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 6);
$( "#to" ).datepicker("option",{minDate: new Date(dateStr), maxDate:endDate});

您可以将maxDate设置为$( "#to" ) datepicker的最后一周日期。

$("#from").datepicker({
  defaultDate: new Date(),
  minDate: new Date(),
  beforeShowDay: $.datepicker.noWeekends,
  onSelect: function(dateStr)
  {
      $("#to").val(dateStr);
      var date = $(this).datepicker('getDate');
         endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 6);
      $( "#to" ).datepicker("option",{minDate: new Date(dateStr), maxDate:endDate});
      
  }
});

$('#to').datepicker({
  defaultDate: new Date(),
  beforeShowDay: $.datepicker.noWeekends,
  onSelect: function(dateStr) {
    toDate = new Date(dateStr);
    //fromDate = ConvertDateToShortDateString(fromDate);
    //toDate = ConvertDateToShortDateString(toDate);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<link href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<input id="from">
<input id="to">

jQuery Datepicker - 将第一个选择器设置为限制为第二个选择器的活动周

1 个答案: