8

我正在使用这个多日期选择器。是否可以使用不选择周末的日期范围模式?

我已经完成了多日期选择器,其中周末被阻止,用户只能选择 5 天,但这不是我的目标。我想要这个功能:当用户点击特定日期时,将突出显示范围内的五天而没有周末...

我的代码如下:

jQuery('#deliverydate').multiDatesPicker({
   minDate:0,
   beforeShowDay: noWeekendsOrHolidays,
   mode: 'daysRangeWithoutWeekends', 
   autoselectRange: [0,5],
   numberOfMonths: 2            
});

现在我离我自己的解决方案很近了:

如果几天范围内有周末,我计算所有必须启用的天数和所有必须选择的新天数。

我在 multidatepicker.js daysRangeWithoutWeekends 中添加了我的新方法,我计算了所有新的和禁用的天数。然后我使用两个 foreach 循环来禁用和启用新日期:

$.each(all_removed_dates, function(index, value) { 
    methods.removeDates.call(obj, value);
});

$.each(all_new_dates, function(index, value) { 
     methods.addDates.call(obj,value);
});

值是日期对象。第一个 foreach 循环完美运行并删除了所有突出显示的周末,但第二个循环不起作用。它返回我错误:

Empty array of dates received.

你知道为什么吗?

对于所有你不明白我的目标是什么: 没有周末的 multidatepicker 范围

如果我点击 21.6.2012 日期 21.6., 22.6., 25.6., 26.6., 27.6. 我必须在没有周末的范围内选择 5 天。必须选择。

使用上面的代码,我设法在周末删除突出显示的课程,但不知道为什么第二个循环(看我的代码上面)没有突出显示 26.6.2012 和 27.6.2012。

4

5 回答 5

0

首先,这不是通用的解决方案。我没有时间寻求通用解决方案。我的解决方案是,如果您必须在没有周末的情况下选择 5 天。

在 jquery-ui.multidatepicker.js 中 onSelect 方法(cca.81 行)添加:

if(this.multiDatesPicker.mode == 'daysRangeWithoutWeekends'  && this.multiDatesPicker.dates.picked.length > 0){
      var i = 0,
      last

      if(this.multiDatesPicker.dates.picked[0].getDay() == 2){  //thusday
           i = 1
           //remove sunday
           all_removed_dates.push(this.multiDatesPicker.dates.picked[4])
      } 
      if(this.multiDatesPicker.dates.picked[0].getDay() == 3){//wednesday
           i = 2 
           //remove sunday and saturday 
           all_removed_dates.push(this.multiDatesPicker.dates.picked[3],                      this.multiDatesPicker.dates.picked[4])
      }
      if(this.multiDatesPicker.dates.picked[0].getDay() == 4){ //thursday
           i=2
           all_removed_dates.push(this.multiDatesPicker.dates.picked[2], this.multiDatesPicker.dates.picked[3])                                   
      }  
      if(this.multiDatesPicker.dates.picked[0].getDay() == 5){ //friday
           i=2
           all_removed_dates.push(this.multiDatesPicker.dates.picked[1], this.multiDatesPicker.dates.picked[2])                                   
      } 

      last = this.multiDatesPicker.dates.picked.pop()
      this.multiDatesPicker.dates.picked.push(last)

      if(this.multiDatesPicker.dates.picked[0].getDay() == 2){ //thusday
            //if we have thusday we add 2 day after last day so last day in range was saturday and we add 2 day and we get date for monday
            var new_date = new Date(last.getFullYear(), last.getMonth(), last.getDate() + 2)
            all_new_dates.push(new_date)
      }else{
          //if there were sunday and saturday in range we add 2 days to last date in range
          for(var j = 1; j <= i; j++){
                var new_date = new Date(last.getFullYear(), last.getMonth(), last.getDate() + j)
                all_new_dates.push(new_date)
          }
      }

      var obj = this
      //remove sunday and saturday 
      $.each(all_removed_dates, function(index, value) { 
          methods.removeDates.call(obj, value);
      });
      //add new days                                  
      $.each(all_new_dates, function(index, value) { 
          methods.add_new_date.call(obj,value);
      });                             
}

在 jquery-ui.multidatepicker.js 中的 toogleDate 方法(cca。431 行)中,在 case 'daysRange' 之前添加:

case 'daysRangeWithoutWeekends':

在 jquery-ui.multidatepicker.js 中的 setMode(cca.473row) 之前 case 'daysRange' 添加:

case 'daysRangeWithoutWeekends':

砑光机初始化:

jQuery('#deliverydate').multiDatesPicker({
   minDate:0,
   beforeShowDay: noWeekendsOrHolidays,
   mode: 'daysRangeWithoutWeekends', 
   autoselectRange: [0,5],
   numberOfMonths: 2            
});

如果有人制作通用算法,请分享它=)

于 2012-06-13T10:24:13.683 回答
0

也许只是循环并修改数组内容会起作用吗?

if (this.multiDatesPicker.mode === 'daysRangeWithoutWeekends' && this.multiDatesPicker.dates.picked.length > 0) {
    var i = 0,
        saturdayFound = false,
        sundayFound = false;
    for (i = 0; i < this.multiDatesPicker.dates.picked.length; i += 1) {
        if (this.multiDatesPicker.dates.picked[i].getDay() === 6) {
            this.multiDatesPicker.dates.picked[i] = this.multiDatesPicker.dates.picked[i].addDays(2); //make it Monday
            saturdayFound = true;
        }
        if (this.multiDatesPicker.dates.picked[i].getDay() === 0) {
            this.multiDatesPicker.dates.picked[i] = this.multiDatesPicker.dates.picked[i].addDays(1); //make it Monday
            sundayFound = true;
        }
        if (saturdayFound || sundayFound) {
            //weekend exists before this element in the array
            if ((this.multiDatesPicker.dates.picked[i].getDay() > 0) || (this.multiDatesPicker.dates.picked[i].getDay() < 6)) {
                //weekday found following weekend
                if (saturdayFound) {
                    this.multiDatesPicker.dates.picked[i] = this.multiDatesPicker.dates.picked[i].addDays(1); //add a day to offset for Saturday
                }
                if (sundayFound) {
                    this.multiDatesPicker.dates.picked[i] = this.multiDatesPicker.dates.picked[i].addDays(1); //add a day to offset for Sunday
                }
            }
        }
    }
    all_new_dates = this.multiDatesPicker.dates.picked;
}
于 2012-06-18T13:57:27.093 回答
0

你为什么不试试这个

methods.addDates.call(obj,all_new_dates);

而不是这个

$.each(all_new_dates, function(index, value) { 
     methods.addDates.call(obj,value);
});
于 2012-06-13T16:03:27.193 回答
0

使用以下代码更改 daysRange 大小写

案例“天数范围”:

this.multiDatesPicker.dates[type] = []; // deletes all picked/disabled 
var end = this.multiDatesPicker.autoselectRange[1];
var begin = this.multiDatesPicker.autoselectRange[0];
if(end < begin) { // switch
    end = this.multiDatesPicker.autoselectRange[0];
    begin = this.multiDatesPicker.autoselectRange[1];
}

var i1=begin;
var i2=begin;
while(i1<end){
    var tep= new Date(methods.sumDays(date, i2));
    if(tep.getDay()!=0 && tep.getDay()!=6){
        methods.addDates.call(this, methods.sumDays(date, i2), type);
        i1++;
    }
    i2++;
}
于 2015-08-19T05:37:07.210 回答
0

仅在星期日禁用:添加选项 beforeShowDay: noWeekendsOrHolidays

function noWeekendsOrHolidays(date) {
    DateRemove = date.getFullYear()+'-'+date.getMonth()+'-'+date.getDate();
    if (date.getDay() == 0) { // remove dimanche
        return [false, ''];
    } else {
        return [true, ''];
    }
}

如果您在控制台中有错误:错误:收到的空日期数组。在 jquery-ui.multidatepicker.js 中寻找“addDates:函数(日期,类型)”并添加返回 true;

addDates : function( dates, type ) {
            if(dates.length > 0) {
                if(!type) type = 'picked';
                switch(typeof dates) {
                    case 'object':
                    case 'array':
                        if(dates.length) {
                            for(var i = 0; i < dates.length; i++)
                                addDate.call(this, dates[i], type, true);
                            sortDates.call(this, type);
                            break;
                        } // else does the same as 'string'
                    case 'string':
                    case 'number':
                        addDate.call(this, dates, type);
                        break;
                    default: 
                        $.error('Date format "'+ typeof dates +'" not allowed on jQuery.multiDatesPicker');
                }
                //$(this).datepicker('refresh');
            } else {
                return true; // ADD THIS ONE
                $.error('Empty array of dates received.');
            }
        },
于 2016-11-23T08:45:47.990 回答