warum beendet Enter das Formular? (beim NC)
Knud Schröder
- javascript
0 Maja0 Knud Schröder0 Maja
Hallo,
ich hab ein kleines Formular bestehend aus einer Liste, einem Eingabe-Feld und einem submit-Button.
Ich möchte die Enter-Taste abfragen, um die Eingabe zu überprüfen und NUR gegebenenfalls das Formular abzuschicken.
Das Problem ist nur, dass das Formular IMMER abgeschickt wird, auch wenn meine Funktion aufgerufen wird. Ich hab keine Ahnung, wie ich das verhindern könnte.
Ich poste einfach mal den Quelltext, vielleicht kann mir dabei jemand helfen?
Naja, mit dem IE5x läufts schon, aber weder beim NC4.78 noch 6.21.
Gruß,
Knud
<HTML><HEAD>
<meta http-equiv="expires" content="0">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Geräteauswahl Ergoline Avantgarde</title>
<script language="Javascript">
var Netscape = 0;
var xfield = 0;
if(navigator.appName == "Netscape") Netscape = 1;
function TasteGedrueckt(Ereignis) {
if (Netscape == 1) {
// prüfen auf Enter-Taste und ob im Suchfeld, ob nur 1 in Liste, dann ausführen
ntaste = Ereignis.which;
if (ntaste == 13 && xfield == 1) {
if (document.main.Geraet.length == 1) {
// Wert aus Liste holen und ausführen
alert("NC sucks!");
return false;
}
}
}
}
if (Netscape == 1) {
document.onkeydown = TasteGedrueckt;
document.captureEvents(Event.KEYDOWN);
}
function klicked() {
// Doppelklick in der Auswahl (nur IE und NC 6.x)
alert("Doppelklick in der Liste");
}
function suche() {
// eingegebener Suchtext in Großbuchstaben
suchtext = document.main.suchfeld.value.toUpperCase();
if (suchtext != "") {
// text im kompletten Array suchen und Liste aktualisieren
fillSelectFromArrayFULL(document.main.Geraet,a_suche,suchtext)
} else {
// alte (gesicherte) Liste zurückspielen
j = 0;
for (i = 0; i < a_suche.length; i=i+2) {
document.main.Geraet.options[j] = new Option(a_suche[i]);
document.main.Geraet.options[j].value = a_suche[i+1];
j++;
}
}
}
function fillSelectFromArrayFULL(selectCtrl, itemArray, suchtext) {
// Liste löschen
for (i = selectCtrl.options.length; i >= 0; i--) {
selectCtrl.options[i] = null;
}
// neue Einträge hinzufügen
j = 0;
found = false;
for (i = 0; i < itemArray.length; i=i+2) {
stext = itemArray[i].toUpperCase();
if (stext.indexOf(suchtext)>=0){ //gefunden --> Eintrag wieder dazu
found = true;
selectCtrl.options[j] = new Option(itemArray[i]);
selectCtrl.options[j].value = itemArray[i+1];
j++;
}
}
if (found == false) { //nichts gefunden --> wieder Original zurückspielen
j = 0;
for (i = 0; i < itemArray.length; i=i+2) {
selectCtrl.options[j] = new Option(itemArray[i]);
selectCtrl.options[j].value = itemArray[i+1];
j++;
}
}
// ersten Eintrag selektieren
// selectCtrl.options[0].selected = true;
}
var a_suche;
function init() {
a_suche = new Array();
if (document.main) {
// Liste sichern
for(i=0;i<document.main.Geraet.length;++i) {
if (Netscape == 1) {
nelement = a_suche.push(document.main.Geraet.options[i].text);
nelement = a_suche.push(document.main.Geraet.options[i].value);
} else {
a_suche[a_suche.length] = document.main.Geraet.options[i].text;
a_suche[a_suche.length] = document.main.Geraet.options[i].value;
}
}
}
}
</script>
<script for="document" event="onkeydown()" language="JScript" type="text/jscript">
{
ntaste = window.event.keyCode;
if (ntaste == 13 && xfield == 1) {
if (document.main.Geraet.length == 1) {
// Wert aus Liste holen und ausführen
alert("IE sucks!");
return false;
}
}
}
</script>
</head><body background="/common/Ergoline_soft.jpg" bgproperties="fixed" onLoad="init();">
<basefont face="Arial">
<center><table border="0" cellpadding="0" cellspacing="0" width="80%">
<tr><td>
<form action="/cgi-bin/gauswahl.exe" method="GET" name="main" target=header>
<input type="hidden" name="pic" value="erlogo.gif">
<input type="hidden" name="T" value="Ergoline Avantgarde">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr><td align="center" width="20%"><font color="#000000"><b><img src="/bilder/avantgarde.jpg" width="129" height="81"></b></font></td>
<td align=center><font color="#000000" size="5">
<b>Ergoline Avantgarde auswählen</b>
</font><font color="#800080"><b></td></tr>
<tr><td align=center valign=center><font size="4"><strong>
Gerätetyp</strong></font><font size="3"></font></td>
<td align=center><select name="Geraet" size=6 onDblClick="klicked();">
<option selected>52111000 ERGOLINE 550 AVANTGARDE SUPER POWER R AUGE ROT
<OPTION>52111100 ERGOLINE 550 AVANTGARDE SUPER POWER R AUGE ROT KLIMA
<OPTION>52116000 ERGOLINE 550 AVANTGARDE SUPER POWER SR AUGE ROT
<OPTION>52116100 ERGOLINE 550 AVANTGARDE SUPER POWER SR AUGE ROT KLIMA
<OPTION>52121000 ERGOLINE 550 AVANTGARDE SUPER POWER R AUGE BLAU
<OPTION>52121100 ERGOLINE 550 AVANTGARDE SUPER POWER R AUGE BLAU KLIMA
<OPTION>52126000 ERGOLINE 550 AVANTGARDE SUPER POWER SR AUGE BLAU
<OPTION>52126100 ERGOLINE 550 AVANTGARDE SUPER POWER SR AUGE BLAU KLIMA
<OPTION>52211000 ERGOLINE 600 AVANTGARDE SUPER POWER R AUGE ROT
<OPTION>52211100 ERGOLINE 600 AVANTGARDE SUPER POWER R AUGE ROT KLIMA
<OPTION>52215000 ERGOLINE 600 AVANTGARDE TURBO POWER R AUGE ROT
<OPTION>52215100 ERGOLINE 600 AVANTGARDE TURBO POWER R AUGE ROT KLIMA
<OPTION>52216000 ERGOLINE 600 AVANTGARDE SUPER POWER SR AUGE ROT
<OPTION>52216100 ERGOLINE 600 AVANTGARDE SUPER POWER SR AUGE ROT KLIMA
<OPTION>52217000 ERGOLINE 600 AVANTGARDE TURBO POWER SR AUGE ROT
<OPTION>52217100 ERGOLINE 600 AVANTGARDE TURBO POWER SR AUGE ROT KLIMA
<OPTION>52221000 ERGOLINE 600 AVANTGARDE SUPER POWER R AUGE BLAU
<OPTION>52221100 ERGOLINE 600 AVANTGARDE SUPER POWER R AUGE BLAU KLIMA
<OPTION>52225000 ERGOLINE 600 AVANTGARDE TURBO POWER R AUGE BLAU
<OPTION>52225100 ERGOLINE 600 AVANTGARDE TURBO POWER R AUGE BLAU KLIMA
<OPTION>52226000 ERGOLINE 600 AVANTGARDE SUPER POWER SR AUGE BLAU
<OPTION>52226100 ERGOLINE 600 AVANTGARDE SUPER POWER SR AUGE BLAU KLIMA
<OPTION>52227000 ERGOLINE 600 AVANTGARDE TURBO POWER SR AUGE BLAU
<OPTION>52227100 ERGOLINE 600 AVANTGARDE TURBO POWER SR AUGE BLAU KLIMA
<OPTION>34519800 ZENTRALABLUFTSTUTZEN SCHWARZ MIT WARMLUFTRÜCKF. F. AVANTGARDE 550/600
<OPTION>34519900 ZENTRALABLUFTSTUTZEN SCHWARZ OHNE WARMLUFTRÜCKF. F. AVANTGARDE 550/600
</select></td>
</tr><tr><td> </td><td align=center valign=top><font size="3"><xxinput type=submit name="Speichern" value="Auswahl bestätigen"></font>
</td></tr></table>
Suchfeld: <input type=text name=suchfeld size=30 onkeyup="suche();" onFocus="xfield=1;" onBlur="xfield=0;">
</form></td><td valign=bottom align=left>
<form action="/html/GWahl_A.htm" method=get><input type=submit name="Zurück" value="Zurück"></form></td></tr></table>
<table border="0" cellpadding="0" cellspacing="0" width="80%">
<tr><td><img src="/bilder/Achtung.gif" align="right" hspace="0" width="99" height="84"></td>
<td>Bitte lesen Sie die <a href="/cgi-bin/trans.exe?PATH=EINL" target=main>Sicherheitshinweise zum gewählten Gerät!</a></td></tr>
</tr></table></center></body></html>
schau' mal unter folgenden Threads nach, vielleicht ist da was für Dich dabei
http://forum.de.selfhtml.org/?m=22822&t=4043
http://forum.de.selfhtml.org/?m=22612&t=3994
http://forum.de.selfhtml.org/?m=22822&t=4043
http://forum.de.selfhtml.org/?m=22612&t=3994
hab ich nachgeschaut, aber irgendwie hilft es mir nicht weiter.
Hab inzwischen festgestellt, dass es nur noch der Netscape 6.21 ist, der muckt, also das Formular ungewollt und unaufgefordert abschickt.
Stellt sich also lediglich noch die Frage, wie treibe ich es ihm aus?
Er soll halt wirklich nur dann die form-action ausführen, wenn ich im explizit das submit erlaube bzw. selbst aufrufe.
Da ich an zahlreichen Stellen mit der Enter-Taste eben auch (wie t=3994 s.o.) ins nächste Feld springen möchte, (eben auch User-Gewohnheit -> SAP), wäre da ne Lösung echt prima. Weiß echt nicht mehr, wie ich dem Problem noch zu Leibe rücken könnte.
Gruß,
Knud
hab ich nachgeschaut, aber irgendwie hilft es mir nicht weiter.
Hab inzwischen festgestellt, dass es nur noch der Netscape 6.21 ist, der muckt, also das Formular ungewollt und unaufgefordert abschickt.
Stellt sich also lediglich noch die Frage, wie treibe ich es ihm aus?
Er soll halt wirklich nur dann die form-action ausführen, wenn ich im explizit das submit erlaube bzw. selbst aufrufe.
Da ich an zahlreichen Stellen mit der Enter-Taste eben auch (wie t=3994 s.o.) ins nächste Feld springen möchte, (eben auch User-Gewohnheit -> SAP), wäre da ne Lösung echt prima. Weiß echt nicht mehr, wie ich dem Problem noch zu Leibe rücken könnte.
Mit dem unter
http://forum.de.selfhtml.org/?m=22771&t=3994
geposteten Code geht das zumindest mit Netscape 6.2
Hi,
Mit dem unter
http://forum.de.selfhtml.org/?m=22771&t=3994
geposteten Code geht das zumindest mit Netscape 6.2
Tut mir echt leid, aber hilft mir, wie gesagt, im geposteten Problem nicht wirklich weiter, da ich, wie schon erwähnt, nur 1 einziges Input-Feld habe und ich auch keinen "Feld-Wechsel" mit Enter erreichen möchte. Bei meinem Quelltext gehts halt irgendwie trotzallem nicht.
Mit OnChange hatte ich vorher schonmal meine Probleme, mit OnBlur gings dann (wie auch verwendet), sollte aber prinzipiell keine Rolle spielen, oder?
Wenn Du meinen geposteten Quelltext anschaust, hab ich da überhaupt kein submit-button mehr. Nichts mit Klick, nichts mit submit, nichts. Nur die bei der Form definierte Action. Und die wird halt, und das ist das Übel, IMMER ausgeführt, wenn Enter gedrückt wird. Und das wohl scheinbar noch bevor meine Funktion ausgeführt wird.
Vielleicht kopierst Du einfach mal den geposteten Quelltext in eine test.html? Dann lässt sich der Code auch leichter anschauen, denke ich.
Bedanke mich herzlichst für die Mühe,
Knud
Hi Knud!
Ich habe mir das nochmal angesehen und kurz bevor ich ganz am verzweifeln war ;-) habe ich doch noch was entdeckt.
1. An einer Deiner JS-Funktionen liegt es nicht, da das Fenster nach Return auch bei deaktiviertem (!) JS geöffnet wird, obwohl es keinen submit-Button gibt!
2. Im IE ist das auch so.
3. Wenn ich noch ein weiteres input-Feld mit type=text einfüge geht es wie gewünscht.
D.h. bei nur einem <input type=text>-Feld wird nach Return automatisch (bei IE und NN) das im form-tag unter action angegebene Skript gestartet.
Hmm, was fangen wir jetzt damit an?
Moin moin!
D.h. bei nur einem <input type=text>-Feld wird nach Return automatisch (bei IE und NN) das im form-tag unter action angegebene Skript gestartet.
Und das ist genau das, was die HTML-Spezifikation verlangt, also alles im gruenen Bereich, wuerde ich sagen. Allerdings wundert mich, dass der IE es auch so macht, der war eigentlich dafuer bekannt, dass er an dieser Stelle die Spec (mal wieder) nicht einhaelt. Welche Version hast Du denn verwendet?
Hmm, was fangen wir jetzt damit an?
Erstmal nix, weil das Formular ja abhaengig vom Inhalt desselben abgesendet werden soll oder auch nicht. Dazu baut man in das FORM-Tag ein OnSubmit ein, das ... ach was erzaehl ich das eigentlich? Steht doch alles ausfuehrlich erlaeutert an einem nicht gerade weit entfernten Ort, dessen Name mit SELF anfaengt (kleiner Wink mit dem Gartenzaun an Knud). Und damit Knud nicht solange suchen muss, werde ich etwas genauer: http://selfhtml.teamone.de/javascript/beispiele/formulareingaben.htm
So long
Moin moin!
D.h. bei nur einem <input type=text>-Feld wird nach Return automatisch (bei IE und NN) das im form-tag unter action angegebene Skript gestartet.
Und das ist genau das, was die HTML-Spezifikation verlangt,
Also nochmal: Es geht darum aus usability-Gründen usern, die überwiegend SAP R/3 verwenden (und da wird nach einer Eingabe mit der Return-Taste von Feld zu Feld gesprungen) diese Funktionalität auch auf Webseiten anzubieten. Jetzt war das Problem, dass dies mit einem <input type=submit>-Button nicht geht, da mit einem Return auch der click-Event für den Button ausgelöst wird.
Ein Workaround war nun den originären submit-Button weg zu lassen und das Abschicken des Formulars über einen einfachen button <input type=button onClick="submit()"> und der JS-Funktion submit() zu erledigen.
So weit so gut, nun stellt sich aber heraus, dass - auch ohne einen dezidierten submit-Button und _einem_ <input type=text>-Feld - dennoch ein Return reicht um das Formular abzuschickem. Dies ist aber bei einem Formular mit _zwei_ <input type=text>-Feld _nicht_ so!! Läßt man hier auch den <input type=submit>-Button weg passiert nach einem Return nichts!
imho hat dieses Verhalten des Browsers nichts mit einer HTML-Spezifikation zu tun, ich lass mich da aber gerne eines besseren belehren. Bei einer groben Suche in den RFCs habe ich nichts gefunden.
Allerdings wundert mich, dass der IE es auch so macht, der war eigentlich dafuer bekannt, dass er an dieser Stelle die Spec (mal wieder) nicht einhaelt. Welche Version hast Du denn verwendet?
5.00
Hmm, was fangen wir jetzt damit an?
War auf die Ausgangsfrage (wie unterdrücke ich das Abschicken des Formulars bei einem Return)
Danke für den Gartenzaun an Knud, auch wenn ich nicht Knud bin
<head>
<script type="text/javascript">var abschicken=false</script>
</head>
<body>
<form onSubmit="return abschicken" action="irgendws.php" method="post">
Feld <input name=feld1 type=text> <br><br>
<input type=button value="abschicken" onClick="abschicken=true; submit()">
</form>
Und das ist genau das, was die HTML-Spezifikation verlangt,
Also nochmal: Es geht darum aus usability-Gründen usern, die überwiegend SAP R/3 verwenden (und da wird nach einer Eingabe mit der Return-Taste von Feld zu Feld gesprungen) diese Funktionalität auch auf Webseiten anzubieten.
Ich hab mir die anderen Threads, in denen Du geantwortet hast, nicht genau angeguckt, aber ich vermute, Du bringst jene und diesen etwas durcheinander. Knud's Problem war jedenfalls ein anderes, zumindest steht das in seinen Postings. Es geht darum, dass ein Formular automatisch abgeschickt wird, wenn Enter gedrueckt wird, was er manchmal ok findet und manchmal eben nicht will. Es geht nicht darum, mit Enter zum naechsten Feld zu springen, das kann er offenbar schon, wie ich aus seinem zweiten Post mal waghalsig schliesse.
Ein Workaround war nun den originären submit-Button weg zu lassen und das Abschicken des Formulars über einen einfachen button <input type=button onClick="submit()"> und der JS-Funktion submit() zu erledigen.
Hilft bei dem Problem aber auch nicht, da das Formular durch die Enter-Taste abgeschickt wird und nicht durch den Submit-Button. Daher ist es auch egal, ob einer da ist oder nicht, oder auch zwei oder 80 (ist alles moeglich in HTML).
So weit so gut, nun stellt sich aber heraus, dass - auch ohne einen dezidierten submit-Button und _einem_ <input type=text>-Feld - dennoch ein Return reicht um das Formular abzuschickem. Dies ist aber bei einem Formular mit _zwei_ <input type=text>-Feld _nicht_ so!! Läßt man hier auch den <input type=submit>-Button weg passiert nach einem Return nichts!
Wir stellen also fest: Das Abschicken-oder-nicht ist nur von der Anzahl der Textfelder abhaengig, nicht aber von der Anzahl der Submit-Buttons. Und genau das ist der Punkt. Das Formular kann durch Enter abgeschickt werden, wenn *genau* *ein* TEXT-Input vorhanden ist (und keine Textarea, um genau zu sein). Mit einem Submitbutton hat das gar nichts zu tun.
imho hat dieses Verhalten des Browsers nichts mit einer HTML-Spezifikation zu tun, ich lass mich da aber gerne eines besseren belehren. Bei einer groben Suche in den RFCs habe ich nichts gefunden.
In der Spec (steht uebrigens auf http://www.w3.org/TR/html4/) konnte ich jetzt auch keine entsprechende Stelle finden. Und auch im Archiv hat sich scheinbar noch keiner erbarmt, mal einen Link zur Quelle zu setzen. Das aelteste, was ich finden konnte, ist http://forum.de.selfhtml.org/archiv/1998_3/t00215.htm#a854. Sollte alles nur eine Urban legend sein? Wer weiss, aber immerhin machen das ja einige Browser so, also wird wohl immerhin was dran sein.
War auf die Ausgangsfrage (wie unterdrücke ich das Abschicken des Formulars bei einem Return)
Wie unterdruecke ich es *manchmal*, so lautet imho die Frage. Und die Antwort darauf hatte ich gegeben.
Danke für den Gartenzaun an Knud, auch wenn ich nicht Knud bin
Ja, hab ich mir anhand Deines Namens auch gedacht, weil der ist ja Maja. Ich frage mich also, wieso Du Dich angesprochen fuehlst.
So long
Ein Workaround war nun den originären submit-Button weg zu lassen und das Abschicken des Formulars über einen einfachen button <input type=button onClick="submit()"> und der JS-Funktion submit() zu erledigen.
Hilft bei dem Problem aber auch nicht, da das Formular durch die Enter-Taste abgeschickt wird und nicht durch den Submit-Button. Daher ist es auch egal, ob einer da ist oder nicht, oder auch zwei oder 80 (ist alles moeglich in HTML).
Bei Knuds Problem hilft es nicht, richtig, aber wenn mehrere text-input-Felder da sind hilft das schon oder analog zu Deinen Worten:
Das Abschicken-oder-nicht (durch Return!) ist bei nur einem Textfeld unabhängig von der Anzahl der Submit-Buttons.
Sind mehr als ein Textfeld vorhanden kann das Abschicken-oder-nicht mit Return durch Weglassen des <input type=submit>-Buttons verhindert werden.
Ja, hab ich mir anhand Deines Namens auch gedacht, weil der ist ja Maja. Ich frage mich also, wieso Du Dich angesprochen fuehlst.
Nun, da ich auch nach einer Lösung gesucht habe, hätte ich das ja ebenfalls finden können/müssen/sollen...
Danke für den Link zum Forums-Archv den Thread kannte ich vorher nicht!
hi!
imho hat dieses Verhalten des Browsers nichts mit einer HTML-Spezifikation
zu tun, ich lass mich da aber gerne eines besseren belehren. Bei einer
groben Suche in den RFCs habe ich nichts gefunden.
In der Spec (steht uebrigens auf http://www.w3.org/TR/html4/) konnte
ich jetzt auch keine entsprechende Stelle finden.
http://ppewww.ph.gla.ac.uk/~flavell/www/formquestion.html
bye, Frank!