jQuery Datepicker - Date Range

[beginner111]

Hallo,

ich erarbeite gerade ein neues Projekt und benutze dazu den Datepicker. Habe ihn eingebunden und folgendes aus der Doku angewendet: http://jqueryui.com/demos/datepicker/#date-range. Soweit funktioniert auch alles prima.

Jetzt meine Frage: Wenn ich ein Datum bei "from" (also ein Startdatum) wähle möchte ich das bei "to" (Enddatum) man nur die nächsten 5 Tage nach dem Startdatum auswählen kann. Habe schon ein paar sachen ausprobiert, aber noch keine Lösung dafür gefunden. Kann mir dabei vll. jemand helfen?

Mein Code dazu:

  
    $(function() {  
        var dates = $( "#from, #to" ).datepicker({  
            defaultDate: "+1w",  
            showButtonPanel: true,  
            showWeek: true,  
            firstDay: 1,  
            closeText: 'Schließen',  
            currentText: 'Heute',  
            weekHeader: "KW",  
            dayNamesMin: ['So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa'],  
            monthNames: ['Januar', 'Februar', 'März', 'April', 'Mai', 'Juni', 'Juli', 'August', 'September', 'Oktober', 'November', 'Dezember'],  
            numberOfMonths: 1,  
            dateFormat: "dd.mm.yy",  
            altFormat: "dd.mm.yy",  
            onSelect: function( selectedDate ) {  
                    var option = this.id == "from" ? "minDate" : "maxDate",  
                            instance = $( this ).data( "datepicker" ),  
                            date = $.datepicker.parseDate(  
                                    instance.settings.dateFormat ||  
                                    $.datepicker._defaults.dateFormat,  
                                    selectedDate, instance.settings );  
                    dates.not( this ).datepicker( "option", option, date );  
        }  
        });  
    });  

Vielen dan im Vorraus.

[ChrisB]

Hi,

Jetzt meine Frage: Wenn ich ein Datum bei "from" (also ein Startdatum) wähle möchte ich das bei "to" (Enddatum) man nur die nächsten 5 Tage nach dem Startdatum auswählen kann. Habe schon ein paar sachen ausprobiert, aber noch keine Lösung dafür gefunden. Kann mir dabei vll. jemand helfen?

Doku-Vorlese-Service: http://jqueryui.com/demos/datepicker/#option-maxDate

MfG ChrisB

[ChrisB]

Hi,

http://jqueryui.com/demos/datepicker/#option-maxDate

Oh, das scheint sich nur auf das aktuelle Datum zu beziehen, aber keine direkte Möglichkeit vorzusehen, es auf ein gewählte Startdatum zu beziehen.

Wobei, mit dem Codebeispiel zu “set the maxDate option, after init” kann man das vielleicht auch später noch dynamisch setzen.
Also auf die Auswahl eines Startdatums reagieren, und dann maxDate mit diesem Datum plus 5 Tage (erneut) setzen.

MfG ChrisB

[Quincy]

Ich weiß nicht, ob das noch aktuell ist, aber ich hatte vor ein paar Wochen auch mit dem Datepicker zu tun und fand diesen Datepicker ...

http://www.ama3.com/anytime/

in jeder Hinsicht (Anleitung, Umfang, etc) optimal. Vielleicht hilft das ja weiter.

[beginner111]

Danke für deine / Eure Antwort. Das mit dem maxDate habe ich auch schon ausprobiert. Allerdings hat das nicht funktioniert. Vll. habe ich auch nur den Quellcode dazu falsch geschrieben. Das doofe ist nur, das ich leider meine versuche dazu nicht direkt gespeichert habe bzw. immer überschrieben habe.

Hättes du vll. einen Hinweis, wie genau der Quellcode dazu ansehen müsste? Dieser müsste ja dann eigentl. mit in folgenden Abschnitt rein geschrieben werden:

...
            onSelect: function( selectedDate ) {
                    var option = this.id == "from" ? "minDate" : "maxDate",
                            instance = $( this ).data( "datepicker" ),
                            date = $.datepicker.parseDate(
                                    instance.settings.dateFormat ||
                                    $.datepicker._defaults.dateFormat,
                                    selectedDate, instance.settings );
                    dates.not( this ).datepicker( "option", option, date );
        }
...

Oder liege ich da falsch? Danke nochmals im Vorraus.