Artikel merken

[Hanne]

ich möchte gerne auf meiner Seite eine Funktion "merken" anbieten, der User muss sich dazu nicht einloggen. Wie könnte ich dieses umsetzten?

Bis jetzt habe ich dieses im Kopf:

• User geht auf die Seite
• wählt einen Artikel
• auf der Seite gibt es ein Button "merken"
• der User klickt darauf und der Button wechselt in den Status "entfernen"
• gleichzeitig ist auf der Seite "merken" der Artikel

Der Bequemlichkeit halber solltest du Javascript einsetzen. Es wäre unschön, wenn man auf "Merken" klickt und der Browser die ganze Seite neu lädt, nur um (aus Sicht des Benutzers) statt "Merken" "Entfernen" anzuzeigen.
Du kannst als Rückfallmöglichkeit auch noch die Methode Neuladen vorsehen, aber konzentriere dich erstmal auf die Javascript-Variante, denn mit der wirst du 99% aller Besucher glücklich machen.

Du wirst dich darüber informieren müssen,

• wie man beim Anklicken des Elements Merken eine Javascript-Funktion aufruft (Stichwort onclick).
• wie man beim Laden einer Seite dem Element Merken den Text Entfernen verpasst (Stichwort onload und getElementByID).

Speichern solltest du nur die relevanten Informationen, d.h. die reinen Artikelnummern. Speichere eine mit Komma oder Leerzeichen getrennte Liste von Artikelnummern als Zeichenkette, etwa "12,23,856,567,34". So eine Zeichenkette lässt sich leicht verarbeiten und belegt nur einen Platz, also ein Cookie oder einen Web-Storage-Eintrag.

Beim Laden der Seite trennst du die Zeichenkette mit String().split(",") in ein Array auf. Dieses Array kannst du leicht nach dem aktuell angezeigten Artikel bzw. seiner Nummer durchsuchen. Ist die Nummer vorhanden, änderst du den Merken-Text in Entfernen.

Klickt der Benutzer später auf Merken bzw. Entfernen, durchsuchst du das Array erneut nach der Nummer. Falls sie nicht vorhanden ist, fügst du die Nummer dem Array mit Array.push() hinzu, ist sie nicht vorhanden, entfernst du sie mit Array.splice(). Abschließend änderst du den Text Merken / Entfernen, je nach Situation.
Du vermeidest so Mehrfacheinträge und brauchst dich obendrein nicht darum kümmern, was denn gerade auf dem Knöpfchen steht, das gedrückt wurde - du schaltest einfach stur bei jedem Knopfdruck den Eintrag in der Merkliste und die Beschriftung um.

Versuche erstmal, den Kram bis hierhin zusammenzubauen. Wo du die Zeichenkette speicherst, ist erstmal irrelevant. Zum Programmieren kannst du sie auch fest in deinen Code speichern und damit nur so tun, als wäre sie von irgendwo geladen worden.

Anschließend kannst du dich dann immer noch entscheiden, ob du Cookies oder Web Storage benutzt (oder beides, Web Storage als Standard, Cookies als Absicherung - ob Web Storage im Browser funktioniert, lässt sich leicht abfragen). Ich täte wegen der definierten Lebensdauer zu Cookies tendieren.

Falls dir das mit Javascript zu viel ist, kannst du natürlich auf fast die gleiche Art und Weise auch PHP einsetzen. Es muss dann halt nur, wie eingangs bemängelt, bei jedem Merken und Entfernen die Seite neu geladen werden.

Wie du Cookies in PHP speicherst und ausliest, hast du ja schon herausgefunden. Benutze nur statt

setcookie("artikelID", "1", time()+14400);

die Zeile

setcookie("merkliste", $merkliste, time()+14400);

$merkliste wäre die Zeichenkette nach oben erwähntem kommagetrennten Format. Diese Zeichenkette kannst du mit $liste = explode(",", $merkliste) in ein Array verwandeln, im Array mit in_array($artikelnummer, $liste) suchen bzw. array_push($liste, $artikelnummer) anfügen, und das Array am Ende mit implode(",", $liste) wieder zu einer Zeichenkette zusammensetzen, die du dann an setcookie() übergibst.