|
| 1 | +document.addEventListener("DOMContentLoaded", async function () { |
| 2 | + const searchInput = document.getElementById("searchInput"); |
| 3 | + const searchButton = document.getElementById("searchButton"); |
| 4 | + const searchResults = document.getElementById("searchResults"); |
| 5 | + |
| 6 | + let data = {}; |
| 7 | + |
| 8 | + // Tải dữ liệu từ datasheet.json |
| 9 | + async function loadData() { |
| 10 | + try { |
| 11 | + const response = await fetch("./datasheet.json"); |
| 12 | + data = await response.json(); |
| 13 | + } catch (error) { |
| 14 | + console.error("Lỗi tải dữ liệu:", error); |
| 15 | + } |
| 16 | + } |
| 17 | + await loadData(); |
| 18 | + |
| 19 | + // Tìm kiếm theo ID, khóa học hoặc tên người |
| 20 | + function search(query) { |
| 21 | + query = query.toLowerCase(); |
| 22 | + let results = []; |
| 23 | + |
| 24 | + for (let id in data) { |
| 25 | + let courseTitle = data[id].courseTitle; |
| 26 | + let certifiedName = data[id].certifiedName; |
| 27 | + |
| 28 | + if (id.toLowerCase().includes(query) || courseTitle.toLowerCase().includes(query) || certifiedName.toLowerCase().includes(query)) { |
| 29 | + results.push({ id, courseTitle, certifiedName }); |
| 30 | + } |
| 31 | + } |
| 32 | + return results; |
| 33 | + } |
| 34 | + |
| 35 | + // Cập nhật danh sách kết quả |
| 36 | + function updateDropdown(results) { |
| 37 | + searchResults.innerHTML = ""; |
| 38 | + if (results.length === 0) { |
| 39 | + searchResults.style.display = "none"; |
| 40 | + return; |
| 41 | + } |
| 42 | + |
| 43 | + results.forEach(result => { |
| 44 | + let option = document.createElement("option"); |
| 45 | + option.value = result.id; |
| 46 | + option.textContent = `${result.certifiedName} - ${result.courseTitle} (${result.id})`; |
| 47 | + searchResults.appendChild(option); |
| 48 | + }); |
| 49 | + searchResults.style.display = "block"; |
| 50 | + } |
| 51 | + |
| 52 | + // Xử lý khi nhập vào ô tìm kiếm |
| 53 | + searchInput.addEventListener("input", function () { |
| 54 | + let query = searchInput.value.trim(); |
| 55 | + if (query.length > 0) { |
| 56 | + let results = search(query); |
| 57 | + updateDropdown(results); |
| 58 | + } else { |
| 59 | + searchResults.style.display = "none"; |
| 60 | + } |
| 61 | + }); |
| 62 | + |
| 63 | + // Chọn kết quả từ dropdown |
| 64 | + searchResults.addEventListener("change", function () { |
| 65 | + searchInput.value = searchResults.value; // Cập nhật ô tìm kiếm với ID đã chọn |
| 66 | + searchResults.style.display = "none"; |
| 67 | + }); |
| 68 | + |
| 69 | + // Khi nhấn nút tìm kiếm |
| 70 | + searchButton.addEventListener("click", function () { |
| 71 | + let selectedId = searchInput.value.trim(); |
| 72 | + if (data[selectedId]) { |
| 73 | + window.location.href = `?id=${selectedId}`; |
| 74 | + } else { |
| 75 | + alert("Không tìm thấy chứng chỉ!"); |
| 76 | + } |
| 77 | + }); |
| 78 | +}); |
0 commit comments