Hauptmenü

Untermenü

OOP/DOM-Scripting JavaScript - Einstiegstutorial 2 - Ende und Fazit

1. Die Abschnitte

2. Verarbeitung

Im Gegensatz zum ersten Einstiegstutorial greifen wir diesmal direkt auf die öffentliche Eigenschaft error (this.error) zu. Wenn sie einen Inhalt hat, so wird der ausgegeben, wenn nicht, dann manipulieren wir das Formular entsprechend.


document.testform.onsubmit = function () 
{
  ...
  if (check.error)
  {            
    alert (check.error);
    return false;
  }
  else
  {
    this.action 'form.php';
    this.submit();
  }
}

Erläuterung

Falls sich noch immer jemand fragt, was das mit dem this soll, so erkläre ich das hier zum letzten Mal! Die anonyme Funktion document.testform.onsubmit wird beim Klick auf den Submitbutton ausgelöst. Also hat das Objekt document.testform jederzeit Zugriff auf sich selbst. Und das steht im this.

Die Eigenschaft action

..., die vorher fehlte, wird nun in das Formular eingehängt. Und über das submit schicken wir die Formularinhalte ab. Damit umgeht man zwei Probleme. Erstens die Leute, die JavaScript deaktiviert haben (da wäre noch ein Hinweis im <noscript>-Tag angebracht), und zweitens können die Schnelltipper/-klicker nicht sofort losschießen und die Programmierung stören.

3. Fazit

Diese beiden Einstiegstutorials sind wirklich nur der erste Einstieg in das DOM-Scripting und die OOP mit JavaScript. Mehr nicht! Alles wichtige, das ihr wissen müsst, kommt bei den Anfängertutorials. Dort werdet ihr auch erfahren, warum in der Methode function checkMail() das Folgende nicht funktioniert.


if (!form[mail].value.match(/@/))
{
  this.error += ' im Formular ' form.name 
             +  ' ist keine gültige Mail' "\n";
}

Oder warum wir die Funktion zur Mail-Überprüfung nicht als öffentliche Methode aufgebaut haben, also in etwa so.


this.checkMail = function ()
{
  // Code
}

4. Nicht die feine englische Art

In diesem Beispiel verlangen wir von unseren Nutzern ein wenig Geduld. Außerdem sollte man Formulareingaben zusätzlich immer noch mal serverseitig überprüfen. Aber hier geht es nur um JavaScript und eine erste praktische Einführung. Also nehmt dieses Tutorial nicht bierernst.

zurück zum vorherigen Abschnitt