Zwei Funktionen über onClick aufrufen
Jan Mueller
- javascript
0 glan2 Siechfred0 Der Martin
Hallo,
nachdem ich mich in HTML eingearbeitet habe, beschäftige ich mich auch ein bisschen mit Javascript. Meine Frage: In einem Formular soll vor dem Absenden per Email geprüft werden, ob die Felder 'Nachname' und 'Vorname' ausgefüllt wurden. Wenn nicht, soll das eine 'alert'-box ausgegeben werden. Dazu habe ich zwei Funktionen in den <head>-bereich geschrieben:
function pruefe_Nachname()
{
var Eingabe;
Eingabe=window.document.Rb.Nachname.value;
if (Eingabe=="")
{
alert ("Bitte den Nachnamen eingeben!");
return false;
}
}
function pruefe_Vorname()
{
var Eingabe2;
Eingabe2=window.document.Rb.Vorname.value;
if (Eingabe2=="")
{
alert ("Bitte den Vornamen eingeben!");
return false;
}
}
die ich dann im <form name=Rb>-Bereich in der Zeile
<input type=submit value="Absenden" onClick="return pruefe_Nachname();pruefe_Vorname();">
aufrufe. Bis jetzt klappt das aber nur wen der Nachname nicht ausgefüllt wurde. Die Funktion zur Prüfung des Vornamens wird einfach ignoriert!
Passe ich die Zeile so an:
<input type=submit value="Absenden" onClick="return pruefe_Vorname();">
erscheint die 'alert'-Box allerdings auch bei nicht ausgefülltem Vornamen-Feld. Dann wird aber der fehlende Nachname nicht gemeldet.
Mir ist bewusst, dass ich hier sicher einem typischen Anfängerfehler unterliege, aber ich weiß nicht welchem! Also, vielen Dank für die Hilfe!
Jan.
Hallo,
nachdem ich mich in HTML eingearbeitet habe, beschäftige ich mich auch ein bisschen mit Javascript. Meine Frage: In einem Formular soll vor dem Absenden per Email geprüft werden, ob die Felder 'Nachname' und 'Vorname' ausgefüllt wurden. Wenn nicht, soll das eine 'alert'-box ausgegeben werden. Dazu habe ich zwei Funktionen in den <head>-bereich geschrieben:
Stop: Hast du sie in den Head Bereich, oder in den Script-Bereich geschrieben?
function pruefe_Nachname()
{
var Eingabe;
Eingabe=window.document.Rb.Nachname.value;if (Eingabe=="")
{
alert ("Bitte den Nachnamen eingeben!");
return false;
}
}
function pruefe_Vorname()
{
var Eingabe2;
Eingabe2=window.document.Rb.Vorname.value;if (Eingabe2=="")
{
alert ("Bitte den Vornamen eingeben!");
return false;
}
}
Alle deine Überlegungen sind im Prinzip richtig, aber du solltest eine Zentrale Überprüfungsfunktion definieren und Event-Handler sollte "onSubmit" sein.
Ein Beispiel: http://de.selfhtml.org/javascript/beispiele/formulareingaben.htm.
MfG
nachdem ich mich in HTML eingearbeitet habe, beschäftige ich mich auch ein bisschen mit Javascript. Meine Frage: In einem Formular soll vor dem Absenden per Email geprüft werden, ob die Felder 'Nachname' und 'Vorname' ausgefüllt wurden. Wenn nicht, soll das eine 'alert'-box ausgegeben werden. Dazu habe ich zwei Funktionen in den <head>-bereich geschrieben:
Genau das ist das Problem: Vereine sie in einer Funktion. Vom Schema her:
1. Prüfe Vorname
Wenn Vorname nicht ok - Merken!
2\. Prüfe Nachname
Wenn Vorname nicht ok - Zusätzlich zu 1. Merken!
3\. Weitere Prüfungen nach dem selben Schema
4\. Gab's was zu merken?
Nein - return true (Formular versenden)
Ja - Ausgabe einer Fehlermeldung
- return false (Formularversand verhindern)
Viel Erfolg.
Siechfred
Hallo,
function pruefe_Nachname()
{
var Eingabe;
Eingabe=window.document.Rb.Nachname.value;if (Eingabe=="")
{
alert ("Bitte den Nachnamen eingeben!");
return false;
}
}
Programmcode einzurücken, ist eine gute Idee - aber dann mach das doch bitte so, dass du den Code mit jeder Klammerebene ein Stück weiter einrückst. Dann erkennst du die einzelnen Blöcke noch besser, der Code wird übersichtlicher.
Übrigens: Was gibt deine Funktion zurück, wenn die Eingabe okay ist? Nichts? Der Eventhandler, der die Funktion aufruft, erwartet aber in jedem Fall einen Rückgabewert. Im Erfolgsfall bekommt er also etwas Zufälliges, Undefiniertes. Achte immer darauf, dass deine Funktionen in jedem Fall ein gültiges Ergebnis zurückgeben.
Außerdem führst du in dieser Funktion eine Variable ein, weist ihr einen Wert zu, und benutzt sie dann nur an einer einzigen Stelle wieder. In diesem Fall wäre es sinnvoller, document.Rb.Nachname.value direkt zu verwenden, anstatt nochmal in eine lokale Variable umzukopieren.
<input type=submit value="Absenden" onClick="return pruefe_Nachname();pruefe_Vorname();">
Warum kann das nicht so funktionieren, wie du es haben willst?
Nun, im onclick-Handler steht ja eigentlich: Ruf die Funktion pruefe_Nachname auf, schnapp dir ihr Ergebnis, und beende dann den Programmabschnitt. Der zweite Funktionsaufruf steht ja hinter dem return-Statement und wird deshalb nie ausgeführt.
<input type=submit value="Absenden" onClick="return pruefe_Vorname();">
Und noch was: Gewöhn dir am besten gleich die richtige Schreibweise an, also onclick (Kleinbuchstaben). Sowohl Javascript als auch XHTML (falls du das mal verwenden solltest) sind case-sensitive; lediglich HTML duldet dieses Durcheinander von Groß- und Kleinbuchstaben.
Das gilt auch für den obsubmit-Handler, den du in diesem Fall lieber anstelle von onclick verwenden solltest.
Mir ist bewusst, dass ich hier sicher einem typischen Anfängerfehler unterliege, aber ich weiß nicht welchem!
Yo, das liegt in der Natur der Sache, so ging es wahrcheinlich jedem schon mal, der etwas Neues angefangen hat. :-)
So long,
Martin