Ergebnis 1 bis 7 von 7
  1. #1
    nordi ist offline Grünschnabel
    registriert
    29-12-2016
    Beiträge
    3

    Cool Formular: input-Element in div ansprechen

    Ich generiere mir ein Formular via PHP, welches hierarchisch strukturiert Eingaben via Checkboxen erlaubt. Eine Gruppe ist jeweils via <div> definiert. Eine javascript-Funktion soll auf die einzelnen input-Elemente zugreifen können.

    HTML-Code:
    <form id='pflanzen' accept-charset='utf-8'> 
    ...
    <label><input id="Bohnen" onclick='fillHier("1", "Asia Mix", "Bohnen", checked)'  class="einrueck1" type="checkbox" value="false" name="Bohnen" value="Bohnen">Bohnen</label><div class='newLine'></div>
    <div id='Bohnengr'>
      <label><input id="Buschbohnen" onclick='fillHier("2", "Bohnen", "Buschbohnen", checked)'  class="einrueck2" type="checkbox" value="false" name="Buschbohnen" value="Buschbohnen">Buschbohnen</label><div class='newLine'></div>
      <label><input id="Stangenbohnen" onclick='fillHier("2", "Buschbohnen", "Stangenbohnen", checked)'  class="einrueck2" type="checkbox" value="false" name="Stangenbohnen" value="Stangenbohnen">Stangenbohnen</label><div class='newLine'></div>
    </div>         
    ...
    Script:
    HTML-Code:
    ...
        var item = document.getElementById("Bohnengr");
        var elt ;
        elt = document.forms['pflanzen'].div["Bohnengr"].elements[0];       o d e r
        elt = document.getElementById("Bohnengr").elements[0];              o d e r
        elt = item.elements[0]
        elt.checked = false;
    ...
    Hinweis: Ist Teil einer Funktion. Der Pflanzenname "Bohnen" kommt via Variable herein.

    Er findet das <div> der Gruppe. Ich kann aber nicht mit elements[0], elements[1] auf die einzelnen Elemente, d. h. <input...> darauf zugreifen. Sowohl wenn ich die erste Form als auch die 2. oder 3. Zeile benutze. Bei der Konsole von Firefox steigt er aus dem Script vorzeitig aus...

    Mit innerHTML bekomme ich nur die ursprüngliche Ausgangslage, nicht jedoch durch den User die veränderte Situation. Wäre auch eine nicht so elegante Lösung.

    Vorschläge?

    lg nordi
    Geändert von mikdoe (02-01-2017 um 08:44 Uhr) Grund: Code Tags, gelöst

  2. #2
    zirzofer Guest

    AW: Formular: input-Element in div ansprechen

    Mit dem Objekt elements, das in der JavaScript-Objekthierarchie unterhalb des forms-Objekts liegt, haben Sie Zugriff auf Elemente eines Formulars.
    https://wiki.selfhtml.org/wiki/JavaS...forms/elements
    Das Element mit der id "BohnenGr" ist aber ein div.
    --> https://developer.mozilla.org/de/doc...tNode/children
    --> https://developer.mozilla.org/de/doc...ode/childNodes

    PS: <div class='newLine'></div> erscheint mir absolut unelegant
    PPS: verwende keine inline-eventlistener, sondern setze diese mit javascript! https://developer.mozilla.org/en-US/...dEventListener
    PPPS: für code sind die CODE-Tags vorgesehen, kein zitat

    - - - Aktualisiert - - -

    PPPPS: was soll das ganze mit node.js zu tun haben?

  3. #3
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.744

    AW: Formular: input-Element in div ansprechen

    Ich würde ja mit https://developer.mozilla.org/en-US/...mentsByTagName oder https://developer.mozilla.org/en-US/...erySelectorAll arbeiten - also in deinem Fall:
    Code:
    var elements = item.getElementsbyTagName("input");
    oder
    Code:
    var elements = item.querySelectorAll("input, textarea, select");
    - je nachdem, ob du nur <input>s oder auch andere Formularelemente hast.

    PS: Verschoben.

  4. #4
    nordi ist offline Grünschnabel
    registriert
    29-12-2016
    Beiträge
    3

    AW: Formular: input-Element in div ansprechen

    Danke für die Antworten. Ich hole mir jetzt innerhalb der <div>-Gruppe die

    var nodelist = knoten.childNodes;

    und gehe dann alle Nodes der Nodeliste durch, welche ein input-Element darstellen und verändere checked.
    Geändert von mikdoe (01-01-2017 um 20:19 Uhr) Grund: Code Tags

  5. #5
    Avatar von mikdoe
    mikdoe ist offline Administrator
    registriert
    01-05-2010
    Beiträge
    7.777

    AW: Formular: input-Element in div ansprechen

    ist die fragestellung damit gelöst?
    Das deutsche Javascript Forum http://forum.jswelt.de http://forum.jswelt.de/images/logoJsWeltForumV4_32x22.png

  6. #6
    zirzofer Guest

    AW: Formular: input-Element in div ansprechen

    Zitat Zitat von nordi Beitrag anzeigen
    und gehe dann alle Nodes der Nodeliste durch, welche ein input-Element darstellen
    da ist allerdings kkapsners lösung einfacher und effizienter - warum nicht einfach:
    Zitat Zitat von kkapsner Beitrag anzeigen
    Code:
    var elements = item.getElementsbyTagName("input");
    PS:
    Zitat Zitat von zirzofer Beitrag anzeigen
    für code sind die CODE-Tags vorgesehen, kein zitat

  7. #7
    nordi ist offline Grünschnabel
    registriert
    29-12-2016
    Beiträge
    3

    AW: Formular: input-Element in div ansprechen

    Ja, ist gelöst.

Ähnliche Themen

  1. Element ansprechen in dem sich der JS Code befindet
    Von BigBlueHH im Forum JavaScript
    Antworten: 3
    Letzter Beitrag: 28-02-2013, 15:57
  2. Input-Feld ansprechen
    Von mkay2012 im Forum JavaScript
    Antworten: 3
    Letzter Beitrag: 06-04-2012, 11:08
  3. jQuery: per js erstelltes Element ansprechen
    Von pixelfenster im Forum JavaScript
    Antworten: 0
    Letzter Beitrag: 30-01-2011, 20:31
  4. <input> id ansprechen (Initialisieren?)
    Von silent321 im Forum JavaScript
    Antworten: 1
    Letzter Beitrag: 09-06-2009, 21:56
  5. Voriges oder nächstes Element ansprechen
    Von aceman3000 im Forum JavaScript
    Antworten: 1
    Letzter Beitrag: 16-03-2005, 21:38

Stichworte

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •