WEBDESIGN

Dynamisches Dropdown Menü aus Datenbank mit PHP

Dropdown Menüs in dynamischen Websiten haben oft auch keinen statischen Inhalt, sondern werden mit Informationen aus der Datenbank generiert. In diesem Tutorial schauen wir uns an, wie man ein dynamisches Dropdown Menü erstellen kann.

Datenbank und Tabelle

In diesem Tutorial wird eine MySQL Datenbank verwendet, in der eine Tabelle mit 2 Spalten enthalten ist. Die Tabellenstruktur sieht dabei folgendermaßen aus:

CREATE TABLE IF NOT EXISTS `dropdown` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `value` varchar(100) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;

Welche Datenbank man letzten Endes verwendet und wie die zugehörige(n) Tabelle(n) aussehen ist egal. Das Prinzip von Auslesen und HTML Code generieren bleibt immer dasselbe.

Dropdown Menü mit PHP

In diesem Schritt geht es um die Generierung des HTML Codes für das Dropdown Menü. Da das Menü später vielleicht an mehreren Stellen auftaucht, soll eine Funktion die Erstellung übernehmen. Auf diese Weise sparen wir uns redundanten, also doppelten, Code.

Häufig definiert man Konstanten, welche die Verbindungsinformationen zur Datenbank enthalten und global verfügbar sind. Diese Technik wird auch in diesem Tutorial verwendet, d.h. in einer extra config Datei (oder einfach am Anfang des Scriptes) steht folgende Definition:

define('DB_USER', 'root');
define('DB_PASS', '');
define('DB_NAME', 'tutorials');
define('DB_ADDR', 'localhost');

Mit diesem Vorwissen kann es nun an die Erstellung der eigentlichen Funktion gehen. Die Idee dazu ist relativ simpel, ein Standard Dropdown Menü besteht aus einem <select> Element und <option> Elementen, wir lassen beim Auslesen der Daten also direkt HTML Code mit den entsprechenden Daten erzeugen.

In der Praxis sieht die Funktion dann so:

function createDropDown() {
	$db = new mysqli(DB_ADDR, DB_USER, DB_PASS, DB_NAME);	
	$dropdown = '<select>';
	$sql = 'SELECT 
                  //Spalten in der Tabelle die ausgelesen werden
	              id, 
	              value
	        FROM 
                  //Name der Tabelle
	              dropdown
                  //Maximale Anzahl der Elemente   
	        LIMIT 20';
	$stmt = $db->prepare($sql);
	if(!$stmt->execute()) {
		return $db->error; 
	}
	$stmt->bind_result($id, $value);
	while($stmt->fetch()) {
		$dropdown .= '<option value="'.$id.'">'.$value.'</option>';   
	}
	$dropdown .= '</select>';
	return $dropdown;
}

Dieses Funktion ist sehr simpel aufgebaut und kann natürlich entsprechend erweitert werden, so wäre es z.B. denkbar dass der Funktion als Parameter die Tabelle samt Spalte übergeben bekommt und dann darauf basierend beliebige Dropdown Menüs generieren kann, ohne das Änderungen an der Funktion selbst notwendig werden.



Schreib einen Kommentar