MST-NETSOLUTIONS SEO BLOG

Teil 3: Aufbau der Liste

Die Vorbereitungen

Nachdem das Script schon mal mit der Datenbank umgehen kann, gehen wir nun an die eigentliche Funktionalität. Zunächst werden wir Funktionen bauen, um die Einträge zuzufügen und zu löschen. Ändern lasse ich bewusst außen vor. Die Einträge sind meist so kurz, dass man diese auch schnell löschen und wieder anlegen kann. Die Ändern-Funktion kommt dann später dazu.

Die Eingabemaske

Zunächst hängen wir an unsere einkaufsliste.php aus dem letzten Teil eine HTML-Form an, mit der wir einen Eintrag in der Datenbank erzeugen können.

<div>
<form action='einkaufsliste.php?action=einfuegen' method=post >

  <label for="Eintrag">Eintrag</label>
  <input type='text' value='' id="Eintrag" name='Eintrag' id='Eintrag'>
  <label for="kategorie">Kategorie</label>
  <select id="kategorie" name="kategorie">
    <option value="Lebensmittel">Lebensmittel</option>
    <option value="Auto">Auto</option>
    <option value="Drogerie">Drogerie</option>
    <option value="Freizeit">Freizeit</option>
    <option value="Gesundheit">Gesundheit</option>
    <option value="Sonstiges">Sonstiges</option>
  </select>
	
  <br><input type=submit value='buchen' class='button button1'></form>
</div>
<hr>

In der Form rufen wir die gleiche Datei auf und übergeben einen Parameter, welche Aktion ausgeführt werden soll. Parameter werden durch das Fragezeichen von der Datei getrennt. Alle weiteren Parameter würden dann mit dem & angehängt.

<form action='einkaufsliste.php?action=einfuegen' method=post>

Anschließend wird das Formular aufgebaut. Zusätzlich habe ich für die Kategorien einige Vorgaben gemacht. Das ließe sich natürlich auch schön in einer zusätzlichen Kategorietabelle festhalten, aber der Einfachheit halber hier per Dropdown.

Um eigene Kategorien zuzufügen, hier eine Zeile vor das </select> packen:

<option value="Kategorie_Neu">Kategorie_Neu</option>

Den Eintrag in die Datenbank einfügen

Nun müssen wir noch den Code einbauen, damit unsere Eingabe auch in die Datenbank übernommen wird. Das geschieht mit ein paar Zeilen:

<?php
if($_GET["action"]=="einfuegen"){
  $result = $db->query("INSERT INTO $tabelle  ( `checked`,`Name`, `Kategorie`) VALUES ('false','".$_POST["Eintrag"]."','".$_POST["kategorie"]."')");
}
?>

Erstelle jetzt mal ein paar Einträge, damit unsere Liste dann auch gefüllt ist.

Die Einkaufsliste

Natürlich nutzt das Ganze recht wenig, wenn die Artikel nicht angezeigt werden. Dazu brauchen wir folgenden Code:

<h2>Einkaufsliste</h2>
<table id='Tabelle'>
<thead>
<tr><th>Gewählt</th><th>Eintrag</th><th>Kategorie</th><th>Aktion</th></tr>
</thead>

<?php
$abfrage = "SELECT * FROM $tabelle  ORDER BY checked asc,Kategorie asc";    
$ergebnis = $db->query($abfrage);

while($row = mysqli_fetch_object($ergebnis)){
	if($row->checked==1){$Auswahl = 0; $Ausgewaehlt="checked";} else {$Auswahl = 1;$Ausgewaehlt="";}
echo "<tr style='height:50px;'><td><label class=EingabeFeld><input type=checkbox $Ausgewaehlt onclick='location.href=".'"einkaufsliste.php?action=auswahl&Auswahl='.$Auswahl.'&ListeID='.$row->ListeID.'"'."' value='".$row->checked."'><span class=Auswahl></span></label></td><td>".$row->Name."</td><td>".$Kategorie." ".$row->Kategorie."</td><td><a href='einkaufsliste.php?action=loeschen&ListeID=$row->ListeID'>DEL</a></td></tr>";
}
echo "</tbody>";
echo "</table>";
?>

Nach der Überschrift bauen wir eine Tabelle auf. Die Daten aus der Datenbank holen wir mit einer while-Schleife. Dabei Sortieren wir mit ORDER BY checked asc,Kategorie asc zunächst nach ausgewählt oder nicht und anschließend nach Kategorie. So sind alle nicht ausgewählten / zu kaufenden Artikel oben in der Liste und dort gruppiert nach Ihrer Kategorie.

Mit der Zeile if($row->checked==1){$Auswahl = 0; $Ausgewaehlt=“checked“;} else {$Auswahl = 1;$Ausgewaehlt=““;} prüfen wir, ob der Eintrag ausgewählt ist oder nicht und geben den Wert „checked“ in die Variable $Ausgewaehlt, damit die checkbox dann auch den Haken bekommt.

Die Auswahl

Wenn ein Eintrag ausgewählt wurde, also in der Spalte Gewählt angeklickt wurde, muss er auch entsprechend aktualisiert werden. Folgenden Code also noch einfügen:

<?php if($_GET["action"]=="auswahl"){
$result = $db->query("UPDATE $tabelle  set checked='".$_GET["Auswahl"]."' WHERE ListeID=".$_GET["ListeID"]);
}
?>

Datenbankeintrag löschen

Den Löschen-Button „DEL“ haben wir ja schon – also muss da noch die Funktionalität hinter. Packe folgenden Code hinter den Block zum Einfügen. Hier beide zusammen

<?php
if($_GET["action"]=="einfuegen"){
  $result = $db->query("INSERT INTO $tabelle  ( `checked`,`Name`, `Kategorie`) VALUES ('false','".$_POST["Eintrag"]."','".$_POST["kategorie"]."')");
}

if($_GET["action"]=="loeschen"){
  $result = $db->query("DELETE FROM $tabelle  WHERE ListeID=".$_GET["ListeID"]);

}
?>