AJAX Live Search, Poll & Course Wrap-up

<input type="text" id="search" placeholder="Search courses..." />
<ul id="results"></ul>
<script>
  let timer;
  document.getElementById("search").addEventListener("input", (e) => {
    clearTimeout(timer);
    timer = setTimeout(async () => {
      const q = e.target.value;
      if (q.length < 2) return;
      const res = await fetch(`/live-search.php?q=${encodeURIComponent(q)}`);
      const data = await res.json();
      document.getElementById("results").innerHTML =
        data.map((r) => `<li>${r.title}</li>`).join("");
    }, 300);
  });
</script>

<?php
header("Content-Type: application/json");
require "db.php";
$q = "%" . trim($_GET["q"] ?? "") . "%";
$stmt = $pdo->prepare("SELECT title FROM courses WHERE title LIKE :q LIMIT 8");
$stmt->execute([":q" => $q]);
echo json_encode($stmt->fetchAll(PDO::FETCH_ASSOC));

<?php
header("Content-Type: application/json");
require "db.php";

if ($_SERVER["REQUEST_METHOD"] === "POST") {
  $option = (int) ($_POST["option"] ?? 0);
  $stmt = $pdo->prepare("UPDATE poll SET votes = votes + 1 WHERE id = :id");
  $stmt->execute([":id" => $option]);
}

$counts = $pdo->query("SELECT id, label, votes FROM poll")->fetchAll(PDO::FETCH_ASSOC);
echo json_encode($counts);

async function vote(optionId) {
  const body = new FormData();
  body.append("option", optionId);
  const res = await fetch("/vote.php", { method: "POST", body });
  const results = await res.json();
  renderChart(results);
}