<tr> loeschen

[Dieter Raber]

Hallo alle,

Ich tu mich gerade etwas schwer damit eine Tabelle mit JS zu aktualisieren. Im Prinzip soll das so funktionieren:
Tabelle:
      <table border=1>
        <tbody id="basket-block-tbdy">
          <tr>
            <td>Zeile 1</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
    <!-- 10 Rows in meinem Code -->
        </tbody>
      </table>

JS:
  var panierTable = document.getElementById('basket-block-tbdy');
  var allPanierTr = panierTable.getElementsByTagName('tr');
  for(var i = 0; i < allPanierTr.length; i++)
  {
    alert(allPanierTr[i].parentNode.id + ' ' + i)
    allPanierTr[i].parentNode.removeChild(allPanierTr[i]);
  }

Die Tabelle soll nachher neu befuellt werden, aber das spielt erstmal keine Rolle.
Das Problem besteht darin, dass alert() zwar das korrekte Ergebnis anzeigt aber nur jede zweite Reihe geloescht wird (die mit den ungeraden Zahlen).

Anscheinend steh' ich ein bischen auf dem Schlauch...

Gruß,

Dieter

[JürgenB]

Hallo Dieter Raber,

dein Fehler besteht darin, dass du die TRs von 0 an löscht. Wenn aber Nr.0 gelöscht wurde, rücken alle anderen nach, also 1 wird 0, 2 wird 1, ... . Lösche einfach immer TR Nr. 0.

Gruß, Jürgen

[Dieter Raber]

Hallo JürgenB,

Danke fuer deine Hilfe!

Gruß,

Dieter

[wahsaga]

hi,

for(var i = 0; i < allPanierTr.length; i++)
  {
    alert(allPanierTr[i].parentNode.id + ' ' + i)
    allPanierTr[i].parentNode.removeChild(allPanierTr[i]);
  }

Das Problem besteht darin, dass alert() zwar das korrekte Ergebnis anzeigt aber nur jede zweite Reihe geloescht wird (die mit den ungeraden Zahlen).

i ist 0, du löschst das erste TR mit dem Index 0.
Nächster Schleifendurchlauf, i wird auf 1 erhöht, du löschst das TR mit dem Index 1. Durch das löschen des vorherigen sind aber alle TR "um eins nach oben gerutscht" - das neue mit dem Index 0 lässt du jetzt also völlig unbehelligt.
Usw. usf.

gruß,
wahsaga

[Dieter Raber]

Hallo wahsaga,

Danke fuer Deine Hilfe, ergaenzend ist mir noch aufgefallen, dass man

for(var i = 0; i < allPanierTr.length; i++)

allPanierTr.length muss vor Schleife einer Variablen zuweisen muss, da es sich innerhalb der Schleife ja aendert.

Gruß,

Dieter

[MudGuard]

Hi,

Danke fuer Deine Hilfe, ergaenzend ist mir noch aufgefallen, dass man

for(var i = 0; i < allPanierTr.length; i++)
allPanierTr.length muss vor Schleife einer Variablen zuweisen muss, da es sich innerhalb der Schleife ja aendert.

Ich würd's so machen:

var theTbody = document.getElementBy...  
while (theTbody.firstChild)  
{  
    theTbody.removeChild(theTbody.firstChild);  
}

cu,
Andreas

[Ashura]

Hallo MudGuard.

Danke fuer Deine Hilfe, ergaenzend ist mir noch aufgefallen, dass man

for(var i = 0; i < allPanierTr.length; i++)
allPanierTr.length muss vor Schleife einer Variablen zuweisen muss, da es sich innerhalb der Schleife ja aendert.

Ich würd's so machen:

Ich ich mit http://de.selfhtml.org/javascript/objekte/htmlelemente.htm#table@title=deleteRow().

Einen schönen Dienstag noch.

Gruß, Ashura

[MudGuard]

Hi,

Ich ich mit http://de.selfhtml.org/javascript/objekte/htmlelemente.htm#table@title=deleteRow().

Schön. Hat aber einen Nachteil gegenüber meiner Methode: ist nur für Tabellenzeilen verwendbar. Meine Variante löscht alle Kindelemente aus einem beliebigen Element.

cu,
Andreas

[Ashura]

Hallo MudGuard.

Ich ich mit http://de.selfhtml.org/javascript/objekte/htmlelemente.htm#table@title=deleteRow().

Schön. Hat aber einen Nachteil gegenüber meiner Methode: ist nur für Tabellenzeilen verwendbar.

Dem Thema folgend, ja.

Meine Variante löscht alle Kindelemente aus einem beliebigen Element.

Aber leider auch alle Kommentare und Zeichendaten in diesem Element, oder?

Einen schönen Dienstag noch.

Gruß, Ashura

[JürgenB]

Hallo MudGuard,

var theTbody = document.getElementBy...

while (theTbody.firstChild)
{
    theTbody.removeChild(theTbody.firstChild);
}

  
oder noch einfacher sofort den ganzen body löschen und neu anlegen bzw. den body durch einen leeren Clone seiner selbst ersetzen.  
  
Gruß, Jürgen

[MudGuard]

Hi,

oder noch einfacher sofort den ganzen body löschen und neu anlegen bzw. den body durch einen leeren Clone seiner selbst ersetzen.

Wenn keine weiteren Referenzen auf das Element an anderer Stelle existieren - die würden sonst ins Leere zeigen, nicht auf den neuen tbody ...
Außerdem mußt Du dann auch ggf. berücksichtigen, an welcher Stelle der neue tbody eingefügt wird - es könnten ja mehrere existieren.

cu,
Andreas

[Dieter Raber]

Hallo MudGuard,

while (theTbody.firstChild)
{
    theTbody.removeChild(theTbody.firstChild);
}

ist natuerlich sehr clever, aber im wahren Leben ist es mal wieder komplizierter. Geloescht wird nur unter bestimmten Bedingungen und auch sonst mache ich noch ein paar Sachen innerhalb der Schleife, die ich der Uebersicht halber nicht mitgepostet habe. Da fand ich eine for-Schleife letztendlich doch am passendsten.

Gruß,

Dieter

[JürgenB]

Hallo Dieter Raber,

... Geloescht wird nur unter bestimmten Bedingungen und auch sonst mache ich noch ein paar Sachen innerhalb der Schleife,

da würde es sich evtl. anbieten, die Schleife rückwärts zu durchlaufen. Dabei entfällt auch das Problem mit dem sich ständig anpassenden xxx.length, da es ja nur beim Start der Schleife benötigt wird.

for(i=xxx.length;i>=0;i--) ...

Gruß, Jürgen

[Dieter Raber]

Hallo JürgenB,

Ihr antwortet hier ja alle sehr trickreich und mir macht es auch Spass, immer neue Anregungen zu bekommen, aber irgendwann muss ich das Script auch mal aus den Haenden legen, sonst kostet diese eine Funktionalitaet am Schluss 25.000 € oder so ;-)

Gruß,

Dieter