Datumseingaben vergleichen 01
    
WWW.WEB-TOOLBOX.NET
  QuellCode ZURÜCK SITEMAP  

 Datumsvergleich An- Abreise Test

 Version 2.1 - 26.11.2005  00:40 Uhr

Beispiel hat Fehler!

(neues JavaScript eingesetzt aber immer noch fehlerhaft, bitte warten)

Das Script vergleicht die Inhalte von 2 Eingabefeldern (Datum) und prüft auf logische Inhalte der beiden Datumseingaben in Bezug auf den Zeitraum der Hotelbuchung. Außerdem: Prüfung beider Eingaben auf gültiges Datumsformat

Ungültige Eingaben:

  • ungültiges Datum, Beispiel: 32.12.2007
  • Das Anreisedatum gleich aktuelles Datum (kann entfernt werden)
  • Das Anreisedatum gleich dem Abreisedatum
  • Die Anreise erfolgt später als die Abreise

Die Prüfung der Eingabe erfolgt beim setzen des Cursers in das nächste Feld.

Benutzt wird hier die Funktion 'OnFocus'

 Onlinebuchung Hotel Gipsbein Hintertux

Anreise:

Abreise:
nächstes Feld   


Oft gibts Ärger mit den Funktionen 'OnBlur' und 'OnFocus'! Denn war der Cursor einmal im Eingabefeld und / oder setzt den Corsor in das nächste Feld, löst man damit eine erneute Prüfung aus. Ergebnis: Endlos-Loop. Nur nach Neuladen des Dokuments kann man wirklich von vorne beginnen.

(Anmerkung, falls beim Testen hier eine Endlosschleife eingeletet wird)




 Erklärung:

Das Script bezieht sich auf das Formular und das entsprechende Eingabefeld, genauer auf den Namen des Formulars und auf die Namen der beiden Textfelder für das Datum.

document.Formular1.DatumsFeld01

document.Formular1.DatumsFeld02


Wenn wie hier beim Verlassen der Eingabefelder gleich eine Prüfung stattfinden soll, wird der Aufruf im Input-Tag notiert! OnBlur bedeutet: Beim Verlassen

<input onFocus="Prüffunktion()" type="text" ...



 Anpassung ihres Formulars:

Wenn sie dieses Script in ihr bestehendes Formular einbinden möchten, kopieren sie den Code in den Head-Bereich. Ändern sie in meinem Script die Einträge für den Formularnamen und die Namen der Eingabefelder (tragen den Namen ihres Formulars und die Namen ihrer Eingabefelder ein).





 CSS-Formatierung des Prüfe-Buttons

im Head: 
<style type="text/css">
<!--
.pruefbutton {
cursor: hand;
border: #6D93E1;
border-style: solid;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
background-color: #C4D3F6;
width:88px;
}
-->
</style>
im Body: 
<input class="pruefbutton" onclick="Pruefe ...





NACH OBEN