Event listener input pada kolom pencarian mengirim query pencarian ke skrip PHP yang mencari baris data dengan SQL LIKE %keyword%.
AJAX Live Search
Contoh Kode AJAX Live Search:
<!DOCTYPE html>
<html>
<body style="font-family: sans-serif; padding: 20px;">
<h2>Simulasi Live Search</h2>
<input type="text" placeholder="Ketik nama materi (misal: CSS)..." oninput="cari(this.value)" style="padding:10px; width:280px; border-radius:6px; border:1px solid #cbd5e1;">
<div id="hasilCari" style="margin-top:15px; font-weight:bold; color:#0d2e5c;"></div>
<script>
function cari(val) {
document.getElementById('hasilCari').innerText = val ? "Mencari data untuk: " + val + "..." : "";
}
</script>
</body>
</html>Uji kode PHP dan amati simulasi output server pada panel pratinjau di atas.