jQuery Datepicker-多个实例并禁用以前选择的日期? [英] jQuery Datepicker - Multiple instances and disable previously selected dates?

问题描述

我有一个页面，用户可以在其中使用jQuery UI Datepicker选择三个不同的约会日.当用户在第一个字段中选择一天时，我希望该日期从其他两个字段中排除.我目前还在禁用星期日，但是无法启用动态日期禁用.

I have a page where the user can select three different appointment days using the jQuery UI Datepicker. When the user selects a day in the first field, I would like that date blocked out from the other two fields. I currently am also disabling Sundays, but cannot get dynamic date disabling working.

    Appointment Time 1<br />
<input id="appointment1_date" type="text" name="appointment1_date" value="Select..." />

Appointment Time 2<br />
<input id="appointment2_date" type="text" name="appointment2_date" value="Select..." />

Appointment Time 3<br />
<input id="appointment3_date" type="text" name="appointment3_date" value="Select..." />


        <script type="text/javascript">
        function noSunday(date){
          var day = date.getDay();
                      return [(day > 0), ''];
          };
        </script>
        <script type="text/javascript">
        $(function() {
            $("#appointment1_date").datepicker(
            {
                minDate: +2, 
                beforeShowDay: noSunday
            });
        });
        $(function() {
            $("#appointment2_date").datepicker(
            {
                minDate: +2, 
                beforeShowDay: noSunday
            });
        });
        $(function() {
            $("#appointment3_date").datepicker(
            {
                minDate: +2, 
                beforeShowDay: noSunday
            });
        });
        </script>

推荐答案

要阻止其他字段中的日期，您必须获取日期并在处理函数中进行比较.根据您提供的代码，以下代码可以代替noSunday:

To block out dates from the other fields, you have to obtain the date and do the comparison in your handling function. Given the code you provided, the following should work as a replacement for noSunday:

function noSunday(date) {
      var day = date.getDay();
      return [
          (day > 0 &&
           date.valueOf() != $('#appointment1_date').datepicker('getDate').valueOf()
          ),
          ''
      ];
};

基本上，您不仅要确保day > 0使其不是星期日，而且要确保该日期不等于appointment1_date给出的日期.使用.datepicker('getDate')并将其valueOf()与date进行比较是关键.

Basically, not only do you want to make sure that day > 0 so that it isn't a Sunday, but also make sure that the date is not equal to the date given by appointment1_date. Using .datepicker('getDate') and comparing its valueOf() with date is the key.

您可能想将其重命名为noSundayOrSelected之类的名称或类似描述性的名称.

You might want to rename it something like noSundayOrSelected or something equally descriptive.

这篇关于jQuery Datepicker-多个实例并禁用以前选择的日期?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！