Formularauswertung Javascript-Funktion

Formulare kann man grundsätzlich auf dreierlei Art auswerten, nämlich clientseitig, serverseitig und mit einer Kombination beider Möglichkeiten. Bei der clientseitigen Auswertung kommt in der Regel Javascript zum Einsatz, auf der Serverseite beispielsweise PHP, ASP oder Perl.

Wir wollen uns hier mit der JavaScript Auswertung befassen.

Ich denke, dass es sch bei diesem Themenfeld um JavaScript- Validierung von Formularen handelt, da Auswertung keinen Sinn macht. Man hat nur EINEN JavaScript-Datensatz und wie will man einen einzelnen Datensatz auswerten?

Formulare werden auf Webseiten meist mit HTML gecoded. (Formulare sind Eingabefelder wie bei Kontaktaufnahme etc. auf Webseiten.)
 

JavaScript hilft nun bei der Validierung, d.h. Prüfung. In dem Fall von Formularen kann JavaScript prüfen, ob alle Felder generell richtig ausgefüllt sind. Das heißt, Javascript checkt, ob im "Telefonnummer"-Feld tatsächlich nur Zahlen stehen, ob die Mailadresse nur im Format XX@XX.XX eingegeben ist, ob ein Pflichtfeld vielleciht leer gelassen wurde usw.

Ist das nicht der Fall, wird je nach dem ein Error ausgegeben. (z.B. das Feld wird rot und oben drüber steht "bitte geben Sie ihre Telefonnummer korrekt an")

Die Vorteile der JS- Validierung von Formularen:

• Die Validierung ist sehr angenehm für den Benutzer, da dieser sofort Fehler sieht und es so bei der weiteren Verarbeitung keine unvorhergesehenen Fehler gibt
• Dank der Überprüfung der Daten vor dem Abschicken wird dafür gesorgt, dass der Server nur anfragen erhält, die erstmal korrekt sind. Somit wird die Serverbelastung minimiert.

Die Nachteile der JS-Validierung von Formularen:

• Die Validierung durch JS ist sehr einfach durch den Nutzer zu umgehen. Er kann einfach die JS-Funktion seines Browsers ausstellen und die Eingaben werden nicht mehr überprüft. Somit muss dann der Server die Überprüfung übernehmen (wir erinnern uns: JS= Clientseitig), womit dieser wieder belastet wird und sich doppelte Arbeit gemacht wird.
• Es könnte sein, dass bestimmte Browser JavaScript nicht interpretieren können und es dadurch zu Fehlern kommt. (Eigentlich kann mitlerweile jeder Browser JS)

 

 

Modulare Validierung mit JavaScript

Man kann das Script, dass für die Validierung verantwortlich ist, in verschiedene Module einteilen, was für Flexibilität sorgt. Man kann beispielsweise einzelne Module ändern, und muss nicht jedesmal ein neues Script schreiben.

Was leistet das Script?

Ich bin hier mal so frei und Kopiere eine Tabelle aus SelfHtml.org (mehr im Quellenverzeichnis)

"Neben den Standardtests beherrscht das Script auch einige außergewöhnliche Aufgaben. Im Einzelnen kann es

• überprüfen, ob ein Feld leer ist,
• einen Wert daraufhin überprüfen, ob er eine Zahl ist, auch Dezimalzahlen mit Punkt oder Komma,
• eine Emailadresse auf die korrekte Syntax überprüfen,
• anhand eines regulären Ausdrucks feststellen, ob ein Wert auf ein bestimmtes Muster passt,
• feststellen, ob ein Wert, der einen Preis darstellen soll, in der Form € 10,00 angelegt ist und ihn ggf. korrigieren,
• bei Namen auf die korrekte Klein-/Großschreibung achten und diese ggf. korrigieren."

Wie bereits oben schon einmal kurz erwähnt.

 

Konfiguration

(auch wieder Copy&Paste, besser könnte ich es nicht ausdrücken) Ich weiß nicht, ob die Prüfung tatsächlich so tief in das Thema eingehen könnte, allerdings denke ich, es kann nciht schaden mehr zu wissen)

Die Funktion erwartet drei Parameter:

• die Form, die validiert werden soll (sender), thisist in der Regel die richtige Wahl,
• ein Array mit den Elementen, die validiert werden sollen (myarray), sowie Informationen darüber, was jeweils geprüft werden soll und die entsprechende Fehlermeldung,
• optional eine Überschrift für die Fehlermeldung (err_hd).

Wird der Parameter err_hdnicht gesetzt, lautet die Standardüberschrift "Folgende Fehler sind aufgetreten:".

 

Quellen:

• http://aktuell.de.selfhtml.org/artikel/javascript/formkontrolle/
• Der Kopf meines Ausbilders

Wenn jemand Korrekturen oder Ergänzungen hat, bitte ich darum, diese hier zu ergänzen.