Linksammlung Teil 3 – Feinheiten

Mit Teil 2 war die Linksammlung fast schon vollständig. Heute kommen noch ein paar Feinheiten dazu. Z.B. sollen die Tags ausgegeben und geordnet werden und die Möglichkeit bestehen Links wieder zu löschen.

// Tag-Liste ausgeben
echo "<h2>Tags:</h2>";
echo "<ul class=\"tag-list\">";
foreach ($tags as $tag) {
    echo "<li><a href=\"?tag=$tag\">$tag</a></li>";
}
echo "</ul>";

// Links nach Tag filtern
if (isset($_GET["tag"])) {
    $tag = $_GET["tag"];
    $sql = "SELECT * FROM links WHERE tags LIKE '%$tag%'";
    echo "<button onclick=\"window.location.href='urls.php'\">Zurück</button>";
} else {
    // Alle Links abrufen und nach Datum sortieren
    $sql = "SELECT * FROM links ORDER BY created_at DESC";
}

$result = $conn->query($sql);

if ($result->num_rows > 0) {
    echo "<h2>Links:</h2>";
    echo "<ul>";
    while($row = $result->fetch_assoc()) {
        echo "<li>";
        echo "<a href=\"" . $row["url"] . "\" target=\"_blank\">" . $row["name"] . "</a>";
        echo " <a href=\"?delete=" . $row["id"] . "\" class=\"delete-button\">Löschen</a>";
        echo "</li>";
    }
    echo "</ul>";
} else {
    echo "Keine Links gefunden.";
}

Eigentlich fehlen jetzt nur noch die jeweiligen Tags um das PHP zu kennzeichnen, sowie eventuell CSS. Komplett würde die Datei folgendermaßen aussehen:

<?php

// Datenbankverbindungsdaten
$servername = "localhost";
$username = "dein_benutzername";
$password = "dein_passwort";
$dbname = "db_name";

// Datenbankverbindung herstellen
$conn = new mysqli($servername, $username, $password);

// Überprüfen, ob die Verbindung erfolgreich war
if ($conn->connect_error) {
    die("Verbindung fehlgeschlagen: " . $conn->connect_error);
}

// Datenbank erstellen, falls sie noch nicht existiert
$sql = "CREATE DATABASE IF NOT EXISTS $dbname";
if ($conn->query($sql) === TRUE) {
    //echo "Datenbank erfolgreich erstellt";
} else {
    echo "Fehler beim Erstellen der Datenbank: " . $conn->error;
}

// Datenbank auswählen
$conn->select_db($dbname);

// Tabelle erstellen, falls sie noch nicht existiert
$sql = "CREATE TABLE IF NOT EXISTS links (
    id INT AUTO_INCREMENT PRIMARY KEY,
    url VARCHAR(255) NOT NULL,
    name VARCHAR(255) NOT NULL,
    tags VARCHAR(255),
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
)";
if ($conn->query($sql) === TRUE) {
    //echo "Tabelle erfolgreich erstellt";
} else {
    echo "Fehler beim Erstellen der Tabelle: " . $conn->error;
}

// Link hinzufügen
if ($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST["url"]) && isset($_POST["name"]) && isset($_POST["tags"])) {
    $url = $_POST["url"];
    $name = $_POST["name"];
    $tags = $_POST["tags"];

    // Prepared Statement verwenden, um SQL-Injection zu verhindern
    $stmt = $conn->prepare("INSERT INTO links (url, name, tags) VALUES (?, ?, ?)");
    $stmt->bind_param("sss", $url, $name, $tags);

    if ($stmt->execute() === TRUE) {
        //echo "Link erfolgreich hinzugefügt";
    } else {
        echo "Fehler beim Hinzufügen des Links: " . $stmt->error;
    }
    $stmt->close();
}

// Link löschen
if (isset($_GET["delete"])) {
    $id = $_GET["delete"];

    // Prepared Statement verwenden, um SQL-Injection zu verhindern
    $stmt = $conn->prepare("DELETE FROM links WHERE id=?");
    $stmt->bind_param("i", $id);

    if ($stmt->execute() === TRUE) {
        //echo "Link erfolgreich gelöscht";
    } else {
        echo "Fehler beim Löschen des Links: " . $stmt->error;
    }
    $stmt->close();
}

?>

<!DOCTYPE html>
<html>
<head>
  <title>Linksammlung</title>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <style>
    body {
      font-family: Arial, sans-serif; color: black; background-color: white;
 background-repeat: no-repeat; background-position: right top;
background-attachment: fixed; 
opacity: 0.7; 
margin: 50px;
border: 1px dashed black; /* 1px breite, gestrichelte, schwarze Linie */ padding: 20px; /* 20px Abstand 
    }
a { text-decoration: none; 
color: black;  
}
a:visited { color: black; /* Setzt die Farbe für besuchte Links ebenfalls auf schwarz */ }
    .tag-list {
      list-style: none;
      padding: 0;
      margin-bottom: 20px;
    }
    .tag-list li {
      display: inline-block;
      margin-right: 10px;
    }
    .delete-button {
      color: red;
      font-size: smaller;
    }
    /* Responsive Design für kleinere Bildschirme */
    @media (max-width: 600px) {
      input[type="text"] {
        width: 100%;
      }
    }
  </style>
</head>
<body>

<h1>Linksammlung</h1>

<form method="post">
  URL: <input type="text" name="url" required><br><br>
  Name: <input type="text" name="name" required><br><br>
  Tags (durch Komma getrennt): <input type="text" name="tags"><br><br>
  <input type="submit" value="Link hinzufügen">
</form>

<?php

// Tags abrufen und alphabetisch sortieren
$sql = "SELECT DISTINCT tags FROM links";
$result = $conn->query($sql);
$tags = array();
if ($result->num_rows > 0) {
    while($row = $result->fetch_assoc()) {
        $tags = array_merge($tags, explode(",", $row["tags"]));
    }
    $tags = array_unique($tags);
    sort($tags);
}

// Tag-Liste ausgeben
echo "<h2>Tags:</h2>";
echo "<ul class=\"tag-list\">";
foreach ($tags as $tag) {
    echo "<li><a href=\"?tag=$tag\">$tag</a></li>";
}
echo "</ul>";

// Links nach Tag filtern
if (isset($_GET["tag"])) {
    $tag = $_GET["tag"];
    $sql = "SELECT * FROM links WHERE tags LIKE '%$tag%'";
    echo "<button onclick=\"window.location.href='urls.php'\">Zurück</button>";
} else {
    // Alle Links abrufen und nach Datum sortieren
    $sql = "SELECT * FROM links ORDER BY created_at DESC";
}

$result = $conn->query($sql);

if ($result->num_rows > 0) {
    echo "<h2>Links:</h2>";
    echo "<ul>";
    while($row = $result->fetch_assoc()) {
        echo "<li>";
        echo "<a href=\"" . $row["url"] . "\" target=\"_blank\">" . $row["name"] . "</a>";
        echo " <a href=\"?delete=" . $row["id"] . "\" class=\"delete-button\">Löschen</a>";
        echo "</li>";
    }
    echo "</ul>";
} else {
    echo "Keine Links gefunden.";
}

$conn->close();

?>

</body>
</html>

Schreibe einen Kommentar