fion: Tabellenteile aus-/einblenden

Beitrag lesen

Hallo Gernot,
im Netz kann man mein "Wunderwerk" nicht finden (ist noch lokal in arbeit).
Mein Problem besteht darin, dass ich die Tabellen-ID nicht kenne. Vielleicht mal mehr Infos zum Projekt:
Ich will mit der Seite eine Personalübersicht ausgeben. Die Daten stammen aus einer MySQL-DB und als Tabellen-ID nehm ich einfach die Personal-ID des Mitarbeiters (verhindert Dopplungen). Ich weis also noch nicht wieviel Tabellen ausgegeben werden und in welcher Reihenfolge (da alphabetisch nach Namen sortiert). Vielleicht kann man mit ner While-Schleife und RegExp über alle Tabellen mit ID's laufen. Egal welche ID die Tabelle dann hat, sie wird eingeklappt und ein Link angehängt. Vereinfacht sieht die ausgegebene Datei bis jetzt so aus:

<html>
<head>
<TITLE>Test</TITLE>
<script language="JavaScript" type="text/javascript">
function hide_tableDetails (tableID) {
 if(tableID == 'all') {
  // Hier die Schleife.
  // So funktioniert es aber nicht?!
  while(var table = document.getElementById.match(/^\d{1,}$/)) {
   for(var i = 1; i < table.rows.length; i++) {
    table.rows[i]style.display = 'none';
   }
   // hier noch eine Tabellenzeile einfügen
   // und den Link reinschreiben
   // <a href="javascript:show_tableDetails(tableID)">Details anzeigen</a>
  }
 } else {
  var table = document.getElementById(tableID);

for (var r = 1; r < (table.rows.length - 1); r++) {
   table.rows[r].style.display = 'none';
  }
  // Hier den Link in der letzten Zeile von
  // <a href="javascript:hide_tableDetails(tableID)">Details verbergen</a> nach
  // <a href="javascript:show_tableDetails(tableID)">Details anzeigen</a> ändern
 }
}

function show_tableDetails (tableID) {
 var table = document.getElementById(tableID);

for (var r = 1; r < (table.rows.length - 1); r++) {
  table.rows[r].style.display = '';
 }
 // Hier den Link in der letzten Zeile von
 // <a href="javascript:show_tableDetails(tableID)">Details anzeigen</a> nach
 // <a href="javascript:hide_tableDetails(tableID)">Details verbergen</a> ändern
}
</script>
</head>
<body onload="hide_tableDetails('all')">
<table id="101" border="1">
 <TR>
  <TH>Personal-Nr.</TH>
  <TH>Name</TH>
  <TH>Vorname</TH>
 </TR>
 <TR>
  <TD>101</TD>
  <TD>Mustermann</TD>
  <TD>Max</TD>
 </TR>
 <TR>
  <TH>Stra&szlig;e</TH>
  <TH>PLZ</TH>
  <TH>Ort</TH>
 </TR>
 <TR>
  <TD>Musterstr. 1</TD>
  <TD>12345</TD>
  <TD>Musterstadt</TD>
 </TR>
 <TR>
  <TH>Telefon</TH>
  <TH>Fax</TH>
  <TH>Mobil</TH>
 </TR>
 <TR>
  <TD>01234/56789</TD>
  <TD>01234/56789</TD>
  <TD>0123/4567890</TD>
 </TR>
</table>
<br>
<table id="105" border="1">
 <TR>
  <TH>Personal-Nr.</TH>
  <TH>Name</TH>
  <TH>Vorname</TH>
 </TR>
 <TR>
  <TD>105</TD>
  <TD>Musterfrau</TD>
  <TD>Maxime</TD>
 </TR>
 <TR>
  <TH>Stra&szlig;e</TH>
  <TH>PLZ</TH>
  <TH>Ort</TH>
 </TR>
 <TR>
  <TD>Musterstr. 75</TD>
  <TD>12345</TD>
  <TD>Musterstadt</TD>
 </TR>
 <TR>
  <TH>Telefon</TH>
  <TH>Fax</TH>
  <TH>Mobil</TH>
 </TR>
 <TR>
  <TD>01234/98765</TD>
  <TD>01234/98765</TD>
  <TD>0123/9876543</TD>
 </TR>
</table>
</body>
</html>

Wie schon im Kommentar geschrieben, geht die Schleife so nicht. Es wird nichts zurückgegeben. Ich vermute, ich kann die match-Funktion so nicht auf getElementById anwenden. Ich möchte die Tabellen auch erst beim Laden der Seite einklappen lassen, damit User ohne JavaScript trotzdem alle Infos sehen, nur halt mächtig scrollen müssen ;-).
Regards, fion.