Silke: Formular wird durch Drücken der Eingabetaste abgeschickt

Ich habe durch Zufall festgestellt, daß mein Formular durch Drücken der Eingabetaste abgeschickt wird. Ich möchte jedoch, daß durch das Drücken der Eingabetaste zum nächsten Eingabefeld gewechselt wird und erst durch das Anklicken des Senden-Buttons das Formular versendet wird.
Wie kann ich das erreichen?

  1. hallo silke!

    ist es nicht eher üblich, dass durch drücken der tabulator-taste zum nächsten feld gewechselt wird?

    mfg Roman

    1. Klar ist das üblich. Das Formular wird jedoch intern verwendet und da intern auch mit SAP gearbeitet wird, drücken viele automatisch die Eingabetaste, um zum nächsten Eingabefeld zu kommen. Daher wollte ich diese Fehlerquelle abfangen ;-)

  2. Hi Silke!

    Ja, ja diese inkonsistenten Eingabeprozeduren zwischen SAP und HTML - nur mal so am Rande: Wie macht das SAP bei mySAP?

    Ich habe mir das auch gerade mal angesehen und festgestellt, dass im IE 5.x und in NN 6.2 die Return-Taste das Formular abschickt. Beim NN 4.7 passiert nach Return gar nichts.

    Meine erste Idee war zur Unterscheidung von Return und Submit-Button JavaScript einzusetzen:

    <form onSubmit="alert('submit')"> vs.
    <input type=submit onClick="alert('button')">

    Leider bringt das nichts, da mit einem Return nicht nur der Submit-Event ausgelöst wird, sondern auch der Click-Event des Buttons ;-(

    Eine andere Möglichkeit wäre nicht den "richtigen" submit-Button <input type=submit> zum Abschicken zu verwenden, sondern einen anderen, der dann nicht automatisch mit return ausgelöst wird. Problematisch an dieser Konstrution ist allerdings, dass das Formular nur noch mit eingeschaltetem JS funktioniert.

    <form name=formular action="mailto:me@form.de" method="post">
      Feld 1 <input name=feld1 type=text onChange="document.formular[1].focus()"> <br>
      Feld 2 <input name=feld2 type=text onChange="document.formular[2].focus()"> <br>
      Feld 3 <input name=feld3 type=text onChange="document.formular[0].focus()"> <br><br>

    <input type=button value="abschicken" onClick="submit()">
    </form>

    Bei obigem Beispiel funktioniert nun das Springen von Feld zu Feld mittels Return nur mit NN 6.x (beim IE wird wohl onChange nur über Tab oder Klicken auf einen anderen Bereich ausgelöst) und das Abschicken funktioniert nur mit IE 5 (mit Netscape nicht, da als action "mailto" angegeben wurde s. http://selfhtml.teamone.de/javascript/objekte/forms.htm#submit mit einem "normalen" PHP- oder Perl-Skript sollte es aber gehen).

    Maja

    1. Wow, vielen lieben Dank! Werd mal ein bißchen damit rumspielen ;-)

    2. Das will so leider nicht :-( Er prüft mir meine Mußfelder, wenn die jedoch ausgefüllt sind, überträgt er trotz Drücken der Entertaste trotzdem

      Hab hier mal den Quellcode mit reingepackt (Auszug):

      <form action="cgi-bin/aussentest.pl" method="post" name="bericht">
      <p><input type="button" value="Anlegen" onClick="return chkFormular()">

      Funktion:
      function chkFormular(){
                                 if(document.bericht.kdnr.value == "") {
                                   alert ("Bitte Kundennummer eingeben!");
                                   document.bericht.kdnr.focus();
                                   return false;
                                 }
                                 var chkZ = 1;
                                 for(i=0;i<document.bericht.kdnr.value.length;++i)
                                    if(document.bericht.kdnr.value.charAt(i) < "0" || document.bericht.kdnr.value.charAt(i) > "9") chkZ = -1;
                                    if(chkZ == -1) {
                                      alert("Bitte Zahl eingeben!");
                                      document.bericht.kdnr.focus();
                                      return false;
                                    }
                                 if(document.bericht.NL.options[0].selected == true) {
                                    alert ("Bitte Niederlassung auswählen!");
                                    document.bericht.NL.focus();
                                    return false;
                                 }
                                 if(document.bericht.name.value == "") {
                                   alert ("Bitte Name eingeben!");
                                   document.bericht.name.focus();
                                   return false;
                                 }
                                 if(document.bericht.segm.options[0].selected == true) {
                                   alert ("Bitte Segment auswählen!");
                                   document.bericht.segm.focus();
                                   return false;
                                 }
                                 if(document.bericht.CP.value == "") {
                                   alert ("Bitte Außendienstmitarbeiter eintragen!");
                                   document.bericht.CP.focus();
                                   return false;
                                 }
                                 var chkZ = 1;
                                 for(i=0;i<document.bericht.acryl.value.length;++i)
                                    if(document.bericht.acryl.value.charAt(i) < "0" || document.bericht.acryl.value.charAt(i) > "9") chkZ = -1;
                                    if(chkZ == -1) {
                                      alert("Bitte Zahl eingeben!");
                                      document.bericht.acryl.focus();
                                      return false;
                                    }
                                 var chkZ = 1;
                                 for(i=0;i<document.bericht.alu.value.length;++i)
                                    if(document.bericht.alu.value.charAt(i) < "0" || document.bericht.alu.value.charAt(i) > "9") chkZ = -1;
                                    if(chkZ == -1) {
                                      alert("Bitte Zahl eingeben!");
                                      document.bericht.alu.focus();
                                      return false;
                                    }
                                 document.bericht.submit();
                                }

      1. Das will so leider nicht :-( Er prüft mir meine Mußfelder, wenn die jedoch ausgefüllt sind, überträgt er trotz Drücken der Entertaste trotzdem

        Das steht ja so auch in Deinem Code:

        document.bericht.submit();

        :-)

        Mache doch zwei Buttons: Einen, der die Angaben prüft und ein anderer, der die Angaben ebenfalls prüft und dann aber auch das Formular abschickt.

        Gruß Maja