Spalten einer Tabelle dynamisch ändern

Manchmal möchte man die Spalten einer Tabelle dynamisch ändern so das diese individuell angezeigt werden können. Wie das geht wird hier an einem Beispiel demonstriert, die Daten der Tabelle kommen hierbei aus einer MySQL-Datenbank.

Demo:

Die Spalten der Tabelle haben immer die gleiche Breite, außer ein Wort ist breiter als eine Spalte dann wird die Spalte entsprechend verbreitert.

Wie immer an dieser Stelle folgt der Quelltext:

QuelltextKopierenAusblendenZeilen

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
<!DOCTYPE html>
<html lang="de">
 <head>
  <meta charset="UTF-8">
  <title>Dynamische Spalten in einer Tabelle</title>

  <style>
  body, table {
   font-family: Verdana, Arial, Sans-Serif;
   font-size: 0.85rem;
  }

  td {
   vertical-align: top;
  }
  </style>


 </head>
<body>

<?php
// Verbindung zur Datenbank
$db = new PDO('mysql:host=localhost;dbname=test;charset=utf8''root''');

// Datensätze auslesen
$select $db->query("SELECT `name`, `text` FROM `tabelle`");
$datensaetze $select->fetchAll(PDO::FETCH_OBJ);
$anzahlDatensaetze count($datensaetze);

// Anzahl der Spalten
$maxSpalten 8;
$spalten = isset($_POST["spalten"]) ? $_POST["spalten"] : 1// 1 = Vorauswahl
$spalten $spalten > $maxSpalten || $spalten < $spalten;

// Breite der Spalten
$spaltenBreite floor(100 $spalten);

// Formular
echo '<form method="post">
<p><label>Spalten: ' $spalten 
 <select name="spalten" size="1" onChange="this.form.submit()">
  <option></option>';

for (
$i 1$i <$maxSpalten$i++) {
 echo 
'<option>$i '</option>';
}

echo 
</select>
 </label></p>
</form>

<table border><tr>
';

// Ausgabe der Datensätze
foreach ($datensaetze as $nr => $datensatz) {
 echo 
'<td style="width:' $spaltenBreite '%">.
  
'<b>$datensatz->name ':</b><br>$datensatz->text '</td>';

 
// Berechnen wann eine neue Tabellenzeile beginnt
 
if (in_array($nrrange($spalten 1$anzahlDatensaetze$spalten))) 
  echo 
'</tr><tr>';
}

echo 
'</tr></table>';
?>

</body>
</html>

Tipps

Diashow
Die Diashow liest Bilder aus einem Verzeichnis aus (mit PHP), und zeigt diese mit Hilfe von JavaScript an.
Umstellung von der PHP-Funktion mysql() zu mysqli()
Zur Zeit stellen viele Provider auf PHP 7 um, mit dieser neuen PHP-Version werden viele "alte" Scripte nicht mehr laufen die auf eine Datenbank zugegriffen haben.
Berechnungen mit dem Datum
Feiertage, Mondphase, Wochentag, Sonnenaufgang und Sonnenuntergang, Julianisches Datum, Sternzeichen, ...
Diese Schlagwörter könnten Sie interessieren:
Sicherheit Quelltext Zebra-Tabelle Chatroom Event-Kalender Responsiv Suchmaschine Fotoalbum PHP-Fehlermeldungen AJAX Gästebuch Zeitbalken Sortierung Zeichnen Wecker Wasserzeichen Operatoren SQLite Diashow ASCII