Java JSF XHTML WML JavaScript GlassFish MySQL NetBeans
- Besuche
- 619857
- Heute
- 19
Mit dem JSAction Framework kann man sehr einfach ein HTML Input Element mit einer JavaScript Datumsprüfung verbinden. Dazu kodiert man lediglich eine bestimmte CSS Klasse im HTML Code und schon wird automatisch eine Realtime Prüfung für das Input Element registiert. Der Code bleibt dabei absolut valide.
Die CSS Klasse date kennzeichnet ein Input Element als Datumsfeld. Zusätzlich kann man mit required festlegen ob das Element ein Pflichtfeld sein soll.
<input type="text" name="date1" class="date" />
<input type="text" name="date2" class="date required" />
Die folgenden Felder prüfen die Eingabe in Realtime bei Tastendruck (onkeyup) und beim Verlassen (onblur). Die Eingabe kann mit oder ohne Trennzeichen durchgeführt werden, im zweiten Fall wird das Datum beim Verlassen des Eingabefeldes automatisch formatiert.
Datum 1:
Datum 2: (required)
Das Erscheinungsbild der Eingabefelder definiert man global über CSS Selektoren.
.date { width:80px }
.required { background-color:rgb(255,255,174) }
Für internationale Anwendungen kann man das Datumsformat länderspezifisch setzen. Sowohl die Anordnung der Tage, Monate und Jahre, als auch das Datumstrennzeichen sind dabei frei wählbar. Die Fehlermeldung ist ebenfalls individuell in der passenden Sprache änderbar.
HpResource.datePattern = 'dd.MM.yyyy';
HpResource.dateSeparator = '.';
HpResource.errorDate = 'Kein gültiges Datum!';
Das Standard Datumsformat kann man auch ganz einfach mit einem individuellen Format für ein spezielles Eingabefeld überschreiben.
class="date dd" (nur der Tag)
class="date MM" (nur der Monat)
class="date yyyy" (nur das Jahr)
class="date ddMM" (Tag und Monat)
class="date MMyyyy" (Monat und Jahr)
Autor: Johannes HammoudKommentare Datum: 04.11.2009