stephanbauer: Formularelemente mit JS auslesen

Hallo zusammen,

ich versuche verschiedene Formularfelder mit Javascript auszulesen, leider will mir das nicht so richtig gelingen.
Hier erstmal die Vorgaben:

  • viele Zeilen (<tr>) mit einigen Eingabefeldern (input:text/hidden und select)

  • durch Klicken auf ein Bild sollen die Eingabefelder in dieser Zeile mit Javascript ausgelesen werden (sollen mit Hilfe von Ajax gesendet werden)

  • RETURN/ENTER in einem Textfeld soll das Formular nicht abschicken, da ich die Position des Mauszeigers im Dokument brauche (da ich an der Stelle, an der man sich befindet eine Statusmeldung ausgeben will)

Jetzt habe ich es über 2 Wege versucht.

  1. mit Formular und über onclick="formularAbsenden(event, this.form)" und
    function formularAbsenden(e, f) {
     ...
     f.elements[i].type ..
     f.elements[i].name ..
     f.elements[i].value ..
     ...
    }

Das funktioniert, leider sendet es auch mit RETURN/ENTER

  1. ohne Formular über name="formular1" und onclick="formularAbsenden(event, 'formular1')"
    doch leider scheitere ich da schon an
    function formularAbsenden(e, f) {
     ...
     document.getElementsByName(f)[0].getElementsByTagName("input");
     ...
    }

denn er will getElementsByTagName nicht kennen.

Hat jemand Tipps für micht?

Vielen Dank
sb

  1. Hallo,

    • RETURN/ENTER in einem Textfeld soll das Formular nicht abschicken, ...

    das finde ich allerdings gar nicht gut, es behindert den User im gewohnten Umgang mit Formularen.

    da ich die Position des Mauszeigers im Dokument brauche (da ich an der Stelle, an der man sich befindet eine Statusmeldung ausgeben will)

    Die kannst du ja ebensogut im onsubmit-Handler noch auswerten, dazu ist es nicht nötig, das übliche Standardverhalten zu manipulieren.

    1. ohne Formular über name="formular1" und onclick="formularAbsenden(event, 'formular1')"

    Welchem Element gibst du dann den Namen "formular1"? Wie sieht überhaupt die Struktur deines Dokuments aus?

    doch leider scheitere ich da schon an
    function formularAbsenden(e, f) {
    ...
    document.getElementsByName(f)[0].getElementsByTagName("input");
    ...
    }

    Du suchst also im Dokument das erste Element mit dem Namen f, und darin dann alle Kindelemente vom Elementtyp input.

    denn er will getElementsByTagName nicht kennen.

    Woraus schließt du das? Könnte es nicht eher sein, dass das Element mit dem Namen f gar keine Kindelemente vom Typ input hat? Hast du Teilergebnisse deines Javascript-DOM-Ausdrucks überprüft?

    So long,
     Martin

    --
    F: Was ist schneller: Das Licht oder der Schall?
    A: Offensichtlich der Schall. Wenn man den Fernseher einschaltet, kommt immer erst der Ton, und dann erst das Bild.
      • RETURN/ENTER in einem Textfeld soll das Formular nicht abschicken, ...
        das finde ich allerdings gar nicht gut, es behindert den User im gewohnten Umgang mit Formularen.
        Die kannst du ja ebensogut im onsubmit-Handler noch auswerten, dazu ist es nicht nötig, das übliche Standardverhalten zu manipulieren.

      Das bekomme ich leider nicht hin.
      Wenn ich onsubmit="formularAbsenden(event, this)" verwende bekomme ich bei
      function formularAbsenden(e, f) {
       e.pageY
      }
      oder e.screenY oder e.y "undefined" zurück.

      Welchem Element gibst du dann den Namen "formular1"? Wie sieht überhaupt die Struktur deines Dokuments aus?

      Etwa so (aber unterschiedlich, hängt von der aktuellen Seite ab):

        
      <tr>  
       <td>...</td>  
       <td><input type="text"></td>  
       <td><input type="text"></td>  
       <td><select>..</select></td>  
       <td><input type="image"></td>  
      </tr>  
      
      

      Ist die Frage, habe einiges rumprobiert, da es eigentlich nur mit <a> unterstützt wird und an der Stelle nicht sauber ist.
      Alle TD eingeschlossen, TR eingeschlossen, wollte leider nicht funktionieren.

      1. Ich habe hier etwas gefunden, mit dem man die aktuelle Position ermitteln kann.
        http://droeppez.de/download/js-tut/js-tut/tutorial/position.html

        Mal schauen ob mir das weiterhilft.