Frank Richter: Automatische Nummerierung in Tabelle

Hallo Leute,

ich habe eine Tabelle, bei der ich durch einen Button eine neue Zeile hinzufüge, jetzt will ich aber dass jede neue Zeile durch Nmmeriert wird.

Bin für jede Hilfe dankbar.

Hier mein bestehender Code

<head>  
        <meta http-equiv="content-type" content="text/html; charset=UTF-8" />  
        <script type="text/javascript">  
                function ad_row()  
                {  
                        var table_id = "t1";  
                        var table = document.getElementById( table_id );  
                        var rows = table.getElementsByTagName( "tr" ).length;  
                        var tr = table.insertRow( rows );  
						var th = document.createElement( "th" );  
                        var td1 = document.createElement( "td" );  
                        var td2 = document.createElement( "td" );  
                        var td3 = document.createElement( "td" );  
						var td4 = document.createElement( "td" );  
						var td5 = document.createElement( "td" );  
						th.innerHTML = '11';  
                        td1.innerHTML = '<input type="text" name="member" />';  
                        td2.innerHTML = '<input type="number" name="rh-level" />';  
                        td3.innerHTML = '<input type="number" name="level" />';  
						td4.innerHTML = '<input type="number" name="rhl gegner" />';  
					  	td5.innerHTML = '<input type="number"   name="level gegner" />';  
						tr.appendChild( th );  
                        tr.appendChild( td1 );  
                        tr.appendChild( td2 );  
                        tr.appendChild( td3 );  
                		tr.appendChild( td4 );  
						tr.appendChild( td5 );  
				}  
        </script>  
</head>  
<body>  
<form>  
        <br /><br />  
                <table id="t1" border="1" >  
                <tr>  
                  <th width="20">Pos.</th><th>Member</th><th>RH-Level</th>  
                <th>Level</th><th>RH-Level Gegner</th>  
                <th>Level Gegner</th></tr>  
                <tr>  
                        <th>1</th>  
                        <td><input type="text"   name="member" /></td>  
                        <td><input type="number"   name="rh-level" /></td>  
                        <td><input type="number"   name="level" /></td>  
                        <td><input type="number"   name="rhl gegner" /></td>  
                        <td><input type="number"   name="level gegner" /></td>  
                </tr>  
                <tr>  
                        <th>2</th>  
                        <td><input type="text"   name="member" /></td>  
                        <td><input type="number"   name="rh-level" /></td>  
                        <td><input type="number"   name="level" /></td>  
                        <td><input type="number"   name="rhl gegner" /></td>  
                        <td><input type="number"   name="level gegner" /></td>  
                </tr>  
                <tr>  
                        <th>3</th>  
                        <td><input type="text"   name="member" /></td>  
                        <td><input type="number"   name="rh-level" /></td>  
                        <td><input type="number"   name="level" /></td>  
                        <td><input type="number"   name="rhl gegner" /></td>  
                        <td><input type="number"   name="level gegner" /></td>  
                </tr>  
                <tr>  
                        <th>4</th>  
                        <td><input type="text"   name="member" /></td>  
                        <td><input type="number"   name="rh-level" /></td>  
                        <td><input type="number"   name="level" /></td>  
                        <td><input type="number"   name="rhl gegner" /></td>  
                        <td><input type="number"   name="level gegner" /></td>  
                </tr>  
                <tr>  
                        <th>5</th>  
                        <td><input type="text"   name="member" /></td>  
                        <td><input type="number"   name="rh-level" /></td>  
                        <td><input type="number"   name="level" /></td>  
                        <td><input type="number"   name="rhl gegner" /></td>  
                        <td><input type="number"   name="level gegner" /></td>  
                </tr>  
                <tr>  
                        <th>6</th>  
                        <td><input type="text"   name="member" /></td>  
                        <td><input type="number"   name="rh-level" /></td>  
                        <td><input type="number"   name="level" /></td>  
                        <td><input type="number"   name="rhl gegner" /></td>  
                        <td><input type="number"   name="level gegner" /></td>  
                </tr>  
                <tr>  
                        <th>7</th>  
                        <td><input type="text"   name="member" /></td>  
                        <td><input type="number"   name="rh-level" /></td>  
                        <td><input type="number"   name="level" /></td>  
                        <td><input type="number"   name="rhl gegner" /></td>  
                        <td><input type="number"   name="level gegner" /></td>  
                </tr>  
                <tr>  
                        <th>8</th>  
                        <td><input type="text"   name="member" /></td>  
                        <td><input type="number"   name="rh-level" /></td>  
                        <td><input type="number"   name="level" /></td>  
                        <td><input type="number"   name="rhl gegner" /></td>  
                        <td><input type="number"   name="level gegner" /></td>  
                </tr>  
                <tr>  
                        <th>9</th>  
                        <td><input type="text"   name="member" /></td>  
                        <td><input type="number"   name="rh-level" /></td>  
                        <td><input type="number"   name="level" /></td>  
                        <td><input type="number"   name="rhl gegner" /></td>  
                        <td><input type="number"   name="level gegner" /></td>  
                </tr>  
                <tr>  
                        <th>10</th>  
                        <td><input type="text"   name="member" /></td>  
                        <td><input type="number"   name="rh-level" /></td>  
                        <td><input type="number"   name="level" /></td>  
                        <td><input type="number"   name="rhl gegner" /></td>  
                        <td><input type="number"   name="level gegner" /></td>  
                </tr>  
        </table>  
        <br /><br />  
        <input type="button" value="Zeile hinzufügen" onclick="ad_row()" />  
        <br />  
        <br /><input type="submit" value="OK"/>  
</form>  
</body>
  1. Hallo Leute,

    Hallo Frank!

    Ich glaube, es hätte gereicht, wenn du die Frage einmal gestellt hättest.

    Sei's drum. Hatte zuletzt ein ähnliches Problem:

    var x=0;  
    while(document.getElementById("tabellenZeile"+x)!=null){x++;}  
    tabellenZeile.id="tabellenZeile"+x;
    

    Das gibt dir für x immer eine unvergebene Nummer raus. Im Ergebnis tabellenZeile0, tabellenZeile1, tabellenZeile2, ...tabellenZeile[n].

    Falls es das war, was du gesucht hast.

    Sonst kann ich dir da leider auch nicht helfen.

    Gruß,

    Roadster.

    1. Aloha ;)

      Kleine Anmerkung: Sei nicht zu schnell, jemandem JavaScript ans Herz zu legen. Bevor man JavaScript rausholt, sollte alles andere versucht worden sein. Auch wenn der Hinweis fachlich vielleicht richtig war ist er es nur dann, wenn auch wirklich JavaScript zum Einsatz kommen muss ;)

      Grüße,

      RIDER

      --
      Camping_RIDER a.k.a. Riders Flame a.k.a. Janosch Zoller
      ch:? rl:| br:> n4:? ie:% mo:| va:) js:) de:> zu:) fl:( ss:| ls:[
      1. Aloha ;)

        Hallo RIDER :)

        Kleine Anmerkung: Sei nicht zu schnell, jemandem JavaScript ans Herz zu legen. Bevor man JavaScript rausholt, sollte alles andere versucht worden sein. Auch wenn der Hinweis fachlich vielleicht richtig war ist er es nur dann, wenn auch wirklich JavaScript zum Einsatz kommen muss ;)

        Der wesentlich gravierendere Fehler war, nicht direkt auf deinen Post zu verweisen. Ist mir aber erst hinterher aufgefallen und ich wollte keinen Doppelpost generieren, nachdem ich den TO schon für seinen Dreifachpost gerüffelt hatte: Das hätte meine credibility untergraben! ;)

        Gruß,

        Roadster.

        1. Hallo

          … Das hätte meine credibility untergraben! ;)

          BINGO!

          Tschö, Auge

          --
          Verschiedene Glocken läuteten in der Stadt, und jede von ihnen vertrat eine ganz persönliche Meinung darüber, wann es Mitternacht war.
          Terry Pratchett, "Wachen! Wachen!"
          ie:{ fl:| br:> va:) ls:[ fo:) rl:( ss:| de:> js:| zu:}
          Veranstaltungsdatenbank Vdb 0.3
  2. Hallo Leute,

    ich habe eine Tabelle, bei der ich durch einen Button eine neue Zeile hinzufüge, jetzt will ich aber dass jede neue Zeile durch Nmmeriert wird.

    Bin für jede Hilfe dankbar.

    Brauchst du die Nummerierung auch inhaltlich, oder nur für die Darstellung?
    In letzterem Fall könntest da auch einfach auf eine reinen CSS-Lösung setzen.

    1. @@Murphy:

      nuqneH

      Brauchst du die Nummerierung auch inhaltlich, oder nur für die Darstellung?

      Was hieße „inhaltlich“?

      In letzterem Fall könntest da auch einfach auf eine reinen CSS-Lösung setzen.

      Ja, sonst stirbt ein Kätzchen. Siehe Doku: generierter Inhalt/Nummerierung.

      Qapla'

      --
      „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)