Letzte Änderung: 01.09.2015 18:20 Uhr

Valid HTML 4.01! Valid CSS!

www.brain4.de > Scripts and more... > JavaScript: Datumseingaben auf Korrektheit prüfen  

Datumseingaben auf Korrektheit prüfen

Zum Prüfen wird ausgenutzt, dass JavaScript automatisch nicht existente Daten in existierende Daten umsetzt. So wird zum Beispiel der 29.2.2003 automatisch in den 1.3.2003 umgewandelt. Damit kann man abprüfen, ob Jahr, Monat und Tag des Date-Objektes mit Jahr, Monat und Tag aus den Benutzerangaben übereinstimmen. Wenn nicht, ist das eine fehlerhafte Benutzereingabe.

Zum Testen wird also mit den Eingaben des Benutzers ein neues Date-Objekt erzeugt. Dieses wird mit den Benutzereingaben verglichen, dazu erhält das Date-Objekt eine neue Methode equals. Liefert diese Prüfung false, hat der Benutzer ein Datum ausgewählt, was nicht existiert.

Auf einen Eingabefehler muss das Script natürlich reagieren. Möchte man dem Benutzer zum Beispiel ein korrigiertes Datum vorschlagen, kann man ein Datum erzeugen, welches den letzten Tag des angegebenen Monats repräsentiert. Dazu lässt sich die Funktion getLastDateInMonth benutzen.

Ein Beispiel, die Benutzereingaben zu testen, ist im folgenden demonstriert. Die Funktion testDate zeigt, wie das Testen durchgeführt wird. Diese Funktion muss natürlich den jeweiligen Bedingungen angepasst werden.

Tag: Monat: Jahr:

Date erhält eine Vergleichsmethode

    /**
     * Erweitert das Date-Objekt um eine Funktion, 
     * die ein Datum anhand von Jahr, Monat und Tag vergleichen kann.
     * @param y vierstellige Zahl
     * @param m Monat (von 0 an gezählt (Jan. = 0 .. Dez = 11))
     * @param d Tag
     */
    Date.prototype.equals = function(y, m, d){
        var bOK = false;
        var _year;
        if(!this.getFullYear){
            _year = this.getYear() + 1900;
        } else {
            _year = this.getFullYear();
        }
        var _month = this.getMonth();
        var _day = this.getDate();
        
        return (_year == y && _month == m && _day == d);
    }

Zum Beispielformular

Hilfsmethode getLastDateInMonth()

    /**
     * Liefert das Datum des letzen Tages eines Monats im angegebenen Jahr.
     * @param y Jahr
     * @param m Monat, zu dem der letzte Tag ermittelt werden soll
     *        (z.B. der 28.2.2003 oder der 29.2.2004)
     * @return Date-Object, das Tag, Monat und Jahr enthält
     */  
    function getLastDateInMonth(y, m){

        var d = new Date(y, m+1, 1);
        d.setTime(d.getTime() - 12*3600*1000);
        return d;
    }

Zum Beispielformular

Testroutine

    /**
     * testet die Benutzereingaben und korrigiert das Datum,
     * bei korrekter Eingabe, keine Änderung
     * param aForm Formularobjekt, welches die Felder day, month und year enthalten muss
     */    
    function testDate(aForm){
        var d = aForm.elements["day"].value;
        var m = aForm.elements["month"].value;
        var y = aForm.elements["year"].value;
        
        if( isNaN(parseInt(d, 10)) ||  isNaN(parseInt(m, 10)) || isNaN(parseInt(y, 10)) ){
          alert("Bitte Zahlen eingeben.")
          return;
        }
        if (d.length==0 || m.length==0 || y.length<4 ){
            alert("Bitte ein vollständiges Datum angeben, Jahr bitte vierstellig.")
            return;
        }
        
        m = parseInt(m, 10) - 1;
        
        var datum = new Date(y, m, d);
        if (datum.equals( y, m, d ) ) {
            alert("Eishockey!");
            return;
        }

        var newDate = getLastDateInMonth(y, m);
        if( confirm("Meinten sie vielleicht: "
            + newDate.getDate() + "."
            + (newDate.getMonth()+1) + "." 
            + newDate.getFullYear() + "?" ) )
        {
            
            aForm.elements["day"].value = newDate.getDate();
            aForm.elements["month"].value = (newDate.getMonth()+1);
            aForm.elements["year"].value = newDate.getFullYear();
        }
    }
Bugfixes:

Vielen Dank an Volker Montag für den Hinweis, das ich bei parseInt() den radix 10 vergessen habe. Das führte bei Zahleneingaben, die eine führende Null haben zur Interpretation als Oktalzahl.

Zum Beispielformular

Dokumentation zu diesem Thema

Das Date Objekt in Netscapes Dokumentation. Sie benötigen für den Einsatz dieses Skriptes einen Browser, der JavaScript 1.1 beherrscht, also mindestens NC 2.0.

zur Navigation