Einblenden mittels Div und Table. Probleme

[karstenkurt]

Zählen von Divs in Table, Problem

Hallo,

ich versuche gerade eine Baumstruktur mittels HTML und Javascript nachzubauen. Dabei treffe ich auf unerwartete Probleme.

Dieses Div-Konstrukt (wird noch mehr) habe ich

<div id="Root">
<table border="1" name="tab">
  <tr>
    <td colspan="2">Root</td>
  <tr>
  <div id="Kind1">
    <tr>
      <td colspan="2">Kind1</td>
    </tr>
    <div id="Enkel1">
      <tr>
        <td colspan="2">Enkel1</td>
      </tr>
      <div id="Urenkel1">
        <tr>
          <td colspan="2">Urenekl1</td>
        </tr>
      </div>
    </div>
  </div>
  <div id="Kind2">
    <tr>
      <td colspan="2">Kind2</td>
    </tr>
    <div id="Enkel2">
      <tr>
        <td colspan="2">Enkel2</td>
      </tr>
    </div>
  </div>
</table>
</div>

Nun versuche ich auf die einzlenen Div per JS zuzugreifen. Leider t das mit diesem Script nicht

function test(childElem)
{
  alert("Das Elternelement Root enthält " + document.getElementById('Root').getElementsByTagName('div').length + " Div-Elemente");
  alert("Das Kindelement Kind_1 enthält " + document.getElementById('Kind1').getElementsByTagName('div').length + " Div-Elemente");
  alert("Das Kindelement Enkel_1 enthält " + document.getElementById('Enkel1').getElementsByTagName('div').length + " Div-Elemente");
  alert("Das Kindelement Urenkel_1 enthält " + document.getElementById('Urenkel1').getElementsByTagName('div').length + " Div-Elemente");
  alert("Das Kindelement Kind_2 enthält " + document.getElementById('Kind2').getElementsByTagName('div').length + " Div-Elemente");

}
</script>

Die Meldung lautet:
Das Elternelement Root enthält 5 Div-Elemente
Das Kindelement Kind_1 enthält 0 Div-Elemente
Das Kindelement Enkel_1 enthält 0 Div-Elemente
Das Kindelement Urenkel_1 enthält 0 Div-Elemente
Das Kindelement Kind_2 enthält 0 Div-Elemente

Erwarten würde ich
Das Elternelement Root enthält 5 Div-Elemente
Das Kindelement Kind_1 enthält 2 Div-Elemente
Das Kindelement Enkel_1 enthält 1 Div-Elemente
Das Kindelement Urenkel_1 enthält 0 Div-Elemente
Das Kindelement Kind_2 enthält 1 Div-Elemente


Wie gehts richtig? Wer kann helfen?
Gruß
KK

 

[Maik]

Hi,

hast du das Markup schon mal vom w3c-Validator auf seine Validität überprüfen lassen?

Das div-Element ist kein Nachfahre- oder Nachbarelement des tr-Elements.

Außerdem hast du die erste Tabellenzeile nicht ordnungsgemaäß geschlossen.

 

[karstenkurt]

Hi,

hast du das Markup schon mal vom w3c-Validator auf seine Validität überprüfen lassen?

Nee, ist eine Offline-Resource.

Das entsprechende Tag habe ich geschlossen, danke dafür.

Welche Lösung wäre denn möglich. Hab noch eine etwas ältere Lösng vom MSDN, welche in den Anfängen genauso etwas gemacht hat. Sinn und Zweck ist ein hierachischer Baum mit Checkboxen. Dieser sollen ein- und ausklappbar sein und wenn der Parent angewählt wird, sollen alle Child mit ausgewählt werden. Dektivierung genauso. Teilaktivierungen sollen speziell gekennzeichnet werden. Das Ganze soll performant mit > 50.000 Einträgen arbeiten.
Vorschläge sind gerne gesehen.

Gruß
KK