Buka <div id="notifKeren" style="display:none; position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); background:#333; color:white; padding:20px; border-radius:12px; z-index:10000; text-align:center; box-shadow: 0 4px 15px rgba(0,0,0,0.5); min-width:250px;"> <p id="teksNotif" style="margin:0; font-weight:bold;"></p> </div> <input type='text' id='input' onkeyup='searchTable()'> <table> <tr> <td>Rindi</td><td> </tr> <tr> <td>Gofur</td> </tr> <tr> <td>Faiqunnuha</td> </tr> </table> <script> function searchTable() { var input, saring, status, tbody, tr, td, i, j; var ditemukan = false; // Kita tambah variabel ini buat ngecek ada yang ketemu gak input = document.getElementById("input"); saring = input.value.toUpperCase(); tbody = document.getElementsByTagName("tbody")[0]; tr = tbody.getElementsByTagName("tr"); // 1. Cek kalau tabel kosong if (tr.length === 0) { tampilkanPesanDiv("Barang belum ada di daftar!"); return; } // 2. Proses Pencarian for (i = 0; i < tr.length; i++) { td = tr[i].getElementsByTagName("td"); status = false; // Reset status per baris for (j = 0; j < td.length; j++) { if (td[j].innerHTML.toUpperCase().indexOf(saring) > -1) { status = true; ditemukan = true; // Tandai kalau ada minimal satu yang cocok } } if (status) { tr[i].style.display = ""; } else { tr[i].style.display = "none"; } } // 3. Notifikasi (Hanya muncul kalau dicari tapi GAK ADA yang cocok) if (!ditemukan , saring !== "") { tampilkanPesanDiv("Barang '" + input.value + "' tidak ditemukan!"); } } // Fungsi pembantu biar rapi (Pakai DIV yang kita buat kemarin) function tampilkanPesanDiv(pesan) { const box = document.getElementById("notifKeren"); const teks = document.getElementById("teksNotif"); if(box , teks) { teks.innerText = pesan; box.style.display = "block"; setTimeout(() => { box.style.display = "none"; }, 2500); } } </script>