Spalten einer Tabelle dynamisch ändern
![[Bildschirmfoto]
Spalten einer Tabelle dynamisch ändern [Bildschirmfoto]
Spalten einer Tabelle dynamisch ändern](../scripte/img/spalten_einer_tabelle_dynamisch_aendern.png)
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:
Quelltext: Ausblenden ❘ Kopieren ❘ Link ❘ Zeilen ❘
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
70
71
72
73
74
75
76
77
<!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;
}
td:nth-child(even) {
background-color: rgba(255, 215, 0, 0.7);
}
td:nth-child(odd) {
background-color: rgba(224,224,0, 0.7);
}
</style>
</head>
<body>
<?php
// Verbindung zur Datenbank
$db = new PDO('mysql:host=localhost;dbname=test;charset=utf8mb4', '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 < 1 ? 1 : $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($nr, range($spalten - 1, $anzahlDatensaetze, $spalten)))
echo '</tr><tr>';
}
echo '</tr></table>';
?>
</body>
</html>
Tipps
- Bilder in einer Datenbank-Tabelle speichern und ausgeben
- Das Hochladen von Bildern in die Datenbank und die Anzeige mit PHP ist relativ einfach. Mit dem folgenden PHP-Code lädt der Benutzer die Bilder hoch, die dann sicher in die Datenbank-Tabelle gelangen.
- Diashow
- Die Diashow liest Bilder aus einem Verzeichnis aus (mit PHP), und zeigt diese mit Hilfe von JavaScript an.
- PHP mit Sicherheit
- Sicheres Programmieren – Traue niemals den Eingaben des Benutzers! Speichern Sie fremde Benutzereingaben nie ohne eine Überprüfung in einer Datenbank oder in einer Datei ab.
- SQLite-Datei mit PHP und PDO erstellen
- Der Vorteil von SQLite ist, das die Datenbank eine Text-Datei ist und keine Verbindung zu einem Datenbank-Server benötigt wird.
Abonniere meinen RSS-Feed
um über aktuelle Seiten benachrichtigt zu werden.
Diese Schlagwörter könnten Sie interessieren:
Audio-Player PHPMailer Zebra-Tabelle Passwortschutz Kommentar-Box Metaphone Sprachumschaltung Sicherheit Regenbogen Text Audiodatei Animierte Sternebewertung Authentifizierung Chatroom Responsiv Sortierung Webseitenschutz Gästebuch Parallax Scrolling-Effekt PHP-Fehlermeldungen Mimetypen Sitemaps-Protokoll localStorage SQLite Diashow Lokaler Webserver
Audio-Player PHPMailer Zebra-Tabelle Passwortschutz Kommentar-Box Metaphone Sprachumschaltung Sicherheit Regenbogen Text Audiodatei Animierte Sternebewertung Authentifizierung Chatroom Responsiv Sortierung Webseitenschutz Gästebuch Parallax Scrolling-Effekt PHP-Fehlermeldungen Mimetypen Sitemaps-Protokoll localStorage SQLite Diashow Lokaler Webserver