Maik: Javascript, Input-Feld Dynamisch Anlegen und Auslesen

SELF-Forum

Javascript, Input-Feld Dynamisch Anlegen und Auslesen

Maik
– Informationen zu den Bewertungsregeln

Hallo,

ich möchte in ein vorhandenes Formular neue Input-Felder hinzufügen. Das klappt auch gut. Nun möchte ich die Felder vor dem Abschicken prüfen. Hier kommt nun immer eine Fehlermeldung, dass die erzeugten Input-Felder nicht existieren - in der Ansicht existieren sie aber. Was ist falsch?

Ich habe den Code mal hier reingezogen: (bitte um entschuldigung für die schlechte formatierung)

------------------------

<script type="text/javascript">

function neu()
{
  NewRow = document.getElementById('tab').lastChild.cloneNode(true);
  document.getElementById('tab').appendChild (NewRow);

var i = document.getElementById('tab').childNodes.length - 1;

for(j=0;j<document.getElementById('tab').lastChild.getElementsByTagName('input').length;j++)
  {
   var newname ='inhalt[' +i+ '][' +j+ ']';

document.getElementById('tab').lastChild.getElementsByTagName('input')[j].setAttribute('name', newname) ;
  }

}

function check()
{
// ****** HIER ****** //
// Ich möchte erst mal, dass ich den Inhalt eines erzeugten Feldes angezeigt bekomme, das geht schon mal nicht
// Mit firstChild und lastChild geht es manchmal, wie erreiche ich die dazwischen?
alert(document.getElementById('tab').lastChild.getElementsByTagName('inhalt[3][1]'));
}

</script>

<form action="test.php" method="post" name="form" id="form" onsubmit="return check();">

<table width="447" border="0" cellspacing="0" cellpadding="0" id='tab'>
          <tr>
            <td width="61"><input name="inhalt[0][1]" type="text" size="7"></td>
            <td width="126"><input name="inhalt[0][2]" type="text"  size="20"></td>
            <td width="62"><input name="inhalt[0][3]" type="text" size="7"></td>
            <td width="64"><input name="inhalt[0][4]" type="text"size="7"></td>
            <td width="75"><input name="inhalt[0][5]" type="text"  size="7"></td>
            <td width="59"><div align="left">(l&ouml;schen)</div></td>
          </tr>
        </table>
</form>
<input type="button" value=" Neue Position " onClick="neu()">

</body></html>

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Javascript, Input-Feld Dynamisch Anlegen und Auslesen

    JürgenB Homepage des Autors
    – Informationen zu den Bewertungsregeln

    Hallo Maik,

    die Struktur eine Tabelle sieht so aus: Table, tbody, tr, td. Der tbody muss zwar im HTML nicht explizit aufgeführt werden, ist aber als Knoten immer da. D.h. die tr sind Kinder des tbody und die td sind Kinder des tr. Beachte dieses bitte beim Umgang mit DOM und Tabellen.

    Auf beliebige Kindknoten kannst du mit http://de.selfhtml.org/javascript/objekte/node.htm#child_nodes zugreifen.

    Gruß, Jürgen

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Javascript, Input-Feld Dynamisch Anlegen und Auslesen

      Maik
      – Informationen zu den Bewertungsregeln

      Danke für deine Information. kannst du mir bitte einen Code zeigen, mit dem ich den Inhalt eines Dynamisch Erzeugten Inputfeldes in einem alert angezeigt bekomme. Danke.

      Alle meine Variationen gingen nicht. Danke

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. Javascript, Input-Feld Dynamisch Anlegen und Auslesen

        JürgenB Homepage des Autors
        – Informationen zu den Bewertungsregeln

        Hallo Maik,

        folgendes Beispiel habe ich in meiner Wühlkiste gefunden, vieleicht hilft es.

        ---------------->Schnipp<------------------------------------------

        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
        <html>
        <head>
        <title>Test</title>

        <script type="text/javascript">
        function start() {
        var ipt = document.createElement("input");
        ipt.size=2;          //geht in IE, MOZ, Opera
        //ipt.name="x_y_z";    //geht in MOZ, Opara
        ipt.setAttribute("name","x_y_z",true);//geht im IE und MOZ, Opera noch nicht getestet
        //ipt.onclick="alert(this.name+'\n'+this.value)"; //geht in Opera
        ipt.onclick=function(){alert(this.name+'\n'+this.value)}; //geht auch im IE und im MOZ
        ipt.value="F4";      //geht in IE, MOZ, Opera
        document.getElementsByName("frm")[0].appendChild(ipt) ;

        document.frm.x_y_z = ipt; // für den IE

        if (document.frm.x_y_z) alert(document.frm.x_y_z.value);

        }
        </script>

        </head>

        <body onload="start()">

        <form name="frm" action="" method="" target="">
        <input type="Text" name="i_n_p" value="F1" size="" maxlength="" onclick="alert(this.name+'\n'+this.value)">
        </form>
        </body>

        </html>

        ---------------->Schnapp<------------------------------------------

        Gruß, Jürgen

        Beitrag melden
        –
        Informationen zu den Bewertungsregeln