jquery ui multi Datumsauswahl Datenbereich ohne Wochenenden

Question

Ich verwende diese multidate picker. Ist es möglich, den Datumsbereichsmodus zu verwenden, in dem keine Wochenenden ausgewählt werden?

Ich habe bereits Multidatepicker gemacht, wo Wochenenden blockiert sind und wo Benutzer nur 5 Tage auswählen können, aber das ist nicht mein Ziel. Ich würde diese Funktionalität mag: wenn der Benutzer auf bestimmten Datum klickt, fünf Tage in Reichweite wäre ohne Wochenendtage markiert ...

Mein Code unten:

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

jetzt bin ich ganz in der Nähe meiner eigenen Lösung :

Ich zähle alle Tage, die aktiviert werden müssen und alle neuen Tage, die ausgewählt werden müssen, wenn ein Wochenende im Bereich von Tagen ist.

Ich füge meine neue Methode in multidatepicker.js daysRangeWithoutWeekends hinzu, wo ich alle neuen und deaktivierten Tage zähle. Dann verwende ich zwei Foreach-Schleifen, wo ich neue Daten deaktivieren und aktivieren:

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

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

Wert ist Date-Objekt. Die erste foreach-Schleife funktioniert einwandfrei und entfernt alle markierten Wochenenden, aber die zweite Schleife funktioniert nicht. Es gibt mir Fehler:

Empty array of dates received. 

Wissen Sie warum?

Für alles, was Sie nicht verstehen, was mein Ziel ist:

ich 5 Tage in Reichweite holen, ohne Wochenenden, wenn ich auf klicken 21.6.2012 21.6 Daten, 22,6, 25,6, 26,6, 27,6.. . muss ausgewählt sein.

Mit oberen Code ich geschafft, markierte Klasse an Wochenenden zu entfernen, aber nicht wissen, warum zweite Schleife (siehe meinen Code oberen) 26.6.2012 und 27.6.2012 nicht hervorgehoben.

Answer 1

Zunächst ist dies keine generische Lösung. Ich hatte keine Zeit für eine generische Lösung. Meine Lösung ist, wenn Sie 5 Tage in Reichweite ohne Wochenenden wählen müssen.

in jquery-ui.multidatepicker.js in onSelect Methode (. Cca 81 row) hinzufügen:

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); 
     });        
} 

in jquery-ui.multidatepicker.js in toogleDate Verfahren vor case '(cca 431 Reihe.) daysRange‘add:

case 'daysRangeWithoutWeekends': 

in jquery-ui.multidatepicker.js in setMode (cca.473row) vor case 'daysRange' add:

case 'daysRangeWithoutWeekends': 

calander ist init mit:

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

Wenn jemand generischer Algorithmus bitte teilen zu =)

Answer 2

warum diese

nicht versuchen

methods.addDates.call(obj,all_new_dates); 

statt dessen

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

Answer 3

Vielleicht würde nur das Durchschleifen und Ändern des Array-Inhalts funktionieren?

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; 
} 

Answer 4

Änderung der daysRange Fall mit dem folgenden Code

case '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++; 
} 

Answer 5

disable nur Sonntag: add in Option beforeShowDay: noWeekendsOrHolidays

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

, wenn Sie Fehler in der Konsole: Fehler: Leeres Array der empfangenen Daten. in jquery-ui.multidatespicker.js Suche nach "addDates: Funktion (Daten, Typ)" und add return 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.'); 
      } 
     },