XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   (X)HTML (http://xhtmlforum.de/forumdisplay.php?f=72)
-   -   Datepicker minDat: +2 im Monat Februar (http://xhtmlforum.de/showthread.php?t=70696)

singel 27.02.2014 17:53

Datepicker minDat: +2 im Monat Februar
 
Hallo Forumsuser

Habe ein Kontakt- und Buchungsformular erstellt. Hoffe, es ist mir gelungen alles korrekt in HTML5 zu schreiben.

Ausgangslage:

Im Formular sind 2 Felder um das Datum der Anreise bzw. Abreise einzutragen. Diese Felder werden über den jQuerry-Datapicker bedient. Den Datapicker habe ich so programmiert, dass im Feld Anreise ein Datum vor "Heute" nicht angewählt werden kann. Da die Mindestaufenthaltsdauer 2 Tage betragen soll, wird im Feld Abreise die Auswahl so eingeschränkt, das ein Datum vor Anreise + 2 Tage nicht möglich ist.

Code:

    $("#REQ_anreise_dat").datepicker({
        showButtonPanel: true,
        minDate: 0,
        showOtherMonths: true,
        selectOtherMonths: true,
        changeMonth: true,
        changeYear: true,
        // Schliesst Bildschirmtastatur
        beforeShow: function (input) {
            $("#REQ_anreise_dat").blur();
        },
        onClose: function (selectedDate) {
            var oldDate = selectedDate.split('.');
            var myDate = new Date(oldDate[2], oldDate[1], oldDate[0]);
            myDate.setDate(myDate.getDate() + 2);
            var date = (myDate.getDate().toString().length < 2) ? '0' + myDate.getDate() : myDate.getDate();
            var month = (myDate.getMonth().toString().length < 2) ? '0' + myDate.getMonth() : myDate.getMonth();
            var myDate = date + '.' + month + '.' + myDate.getFullYear();
            if (myDate === "NaN.NaN.NaN") {
                myDate = 0;
                return;
            } else {
                $("#REQ_abreise_dat").datepicker("option", "minDate", myDate);
              alert(myDate);
            }
        }
    });
 //
    $("#REQ_abreise_dat").datepicker({
        showButtonPanel: true,
        minDate: +2,
        showOtherMonths: true,
        selectOtherMonths: true,
        changeMonth: true,
        changeYear: true,
        // Schliesst Bildschiemtastatur
        beforeShow: function (input) {
            $("#REQ_abreise_dat").blur();
        },
        onClose: function (selectedDate) {
            var oldDate = selectedDate.split('.');
            var myDate = new Date(oldDate[2], oldDate[1], oldDate[0]);
            myDate.setDate(myDate.getDate() - 2);
            var date = (myDate.getDate().toString().length < 2) ? '0' + myDate.getDate() : myDate.getDate();
            var month = (myDate.getMonth().toString().length < 2) ? '0' + myDate.getMonth() : myDate.getMonth();
            var myDate = date + '.' + month + '.' + myDate.getFullYear();
            if (myDate === "NaN.NaN.NaN") {
                myDate = 0;
                return;
            } else {
                $("#REQ_anreise_dat").datepicker("option", "maxDate", myDate);
            }
        }
 });

Dieser Code hat bis heute gut funktioniert. Aber eben wir haben nun den 27. Februar. minDate: + 2 Tage berechnet der Code, heute 27.02.2014, nicht mit 1. März 2014 sondern mit einem Datum Oktober 2019!

Wo liegt der Fehler?
Danke für eure Hilfe
Mathias

Thielo 27.02.2014 18:36

A) Falscher Forenbereich
B) Du schreibst was von HTML5, welches HTML5?
C) Welches Datepicker-Script nutzt du?

singel 27.02.2014 19:41

Danke für deine Antwort.

Zitat:

Zitat von Thielo (Beitrag 537462)
A) Falscher Forenbereich

Sorry, kann das verschoben werden?
Zitat:

B) Du schreibst was von HTML5, welches HTML5?
Diese Frage verstehe ich nicht. Gibt es denn verschiedene HTML5?
Zitat:

C) Welches Datepicker-Script nutzt du?
Den jQuery UI Datepicker Version 1.10.3

Gruss Mathias

explanator 27.02.2014 20:04

nimm mal
Code:

minDate: "+2d",

singel 28.02.2014 07:34

Danke für deinen Tipp. Leider war es nicht die Lösung.

cloned 28.02.2014 07:48

Zitat:

Zitat von singel (Beitrag 537465)
Diese Frage verstehe ich nicht. Gibt es denn verschiedene HTML5?

Damit war wohl eher gemeint, dass du uns nur javascript-Code vorgesetzt hast, uns den HTML-Teil aber verschwiegen hast.

singel 28.02.2014 08:22

@cloned:

Der HTML-Code ist, glaube ich, auch irrelevant. Das Script läuft ja bei allen an anderen Daten, ausser im Schaltjahr korrekt. Hier der Code.
HTML-Code:

<div class="ym-fbox ym-fbox-text">
        <label for="REQ_mail1" title="email1">
        e-Mail-Adresse</label>
        <input id="REQ_mail1" name="FROM*"  placeholder="mustermann@xyz.com" pattern="^[-a-z0-9~!$%^&*_=+}{\'?]+(\.[-a-z0-9~!$%^&*_=+}{\'?]+)*@([a-z0-9_][-a-z0-9_]*(\.[-a-z0-9_]+)*\.(aero|arpa|biz|com|coop|edu|gov|info|int|mil|museum|name|net|org|pro|travel|mobi|[a-z][a-z])|([0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}))(:[0-9]{1,5})?$" required="" size="20" tabindex="12" title="Emailadresse 'mustermann@xyz.com'" type="email" value="" />
</div>
<div class="ym-fbox ym-fbox-text">
        <label for="REQ_mail2" title="email2">
        Bestätigen e-Mail-Adresse</label>
        <input id="REQ_mail2" name="mail2*"  placeholder="mustermann@xyz.com" pattern="^[-a-z0-9~!$%^&*_=+}{\'?]+(\.[-a-z0-9~!$%^&*_=+}{\'?]+)*@([a-z0-9_][-a-z0-9_]*(\.[-a-z0-9_]+)*\.(aero|arpa|biz|com|coop|edu|gov|info|int|mil|museum|name|net|org|pro|travel|mobi|[a-z][a-z])|([0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}))(:[0-9]{1,5})?$" required="" size="20" tabindex="13" title="Emailadresse wiederholen 'mustermann@xyz.com'" type="email" value="" />
</div>

@explanator

Der Fehler miss in dieser Zeile liegen:
Code:

myDate.setDate(myDate.getDate() + 2);
Da wird myDate als 30.02.2014 berechnet und nicht als 02.03.2014.

Heute Nachmittag: Habe ich viel im Internet gesucht und einige Beispiele gefunden. Mein Rückschluss: Das Problem muss bei JavaScript oder jQuery liegen. Ist ein reines Februar-Problem.

Hier ein Link: http://jsfiddle.net/GHKRS/7/

Da werden auch seltsame Resultate angezeigt.

singel 28.02.2014 16:32

Glaube ich habe es geschaft. Der Codeausschnitt ab "onClose:" sieht nun so aus:
Code:

      onClose: function(selectedDate) {
            var oldDate = selectedDate.split('.');
            var myDate = new Date(oldDate[2], oldDate[1]-1, oldDate[0]);
            myDate.setDate(myDate.getDate() + 2);
            myDate = $.datepicker.formatDate('dd.mm.yy', new Date(myDate));

Danke für eure Unterstützung
Mathias


Alle Zeitangaben in WEZ +2. Es ist jetzt 13:49 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2020, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2019