JavaScript is redirecting me to .html file, not .php file [closed]

4 weeks ago 33
ARTICLE AD BOX

I'm trying to make my own little search input selection thing, yet it always says:
"404 not found"
"Not Found
The requested URL was not found on this server.
Apache/2.4.58 (Win64) OpenSSL/3.1.3 PHP/8.2.12 Server at localhost Port 80"

I've tried working out something this works:

<p>The Belgrade Encyclopedia is a website situated in <a href="belgrade.php">Belgrade</a>, Serbia...</p>

Yet this doesn't.

document.addEventListener('DOMContentLoaded', () => { const searchInput = document.getElementById("search"); const resultsBox = document.getElementById("search-results"); const pages = [{ name: "Belgrade", link: "http://localhost/belgrade.php" }, { name: "Home", link: "http://localhost/betah_website.php" }, { name: "Serbia", link: "http://localhost/serbia.php" } ]; // --- Search box behavior --- if (searchInput && resultsBox) { resultsBox.style.display = "none"; searchInput.addEventListener("input", () => { const query = searchInput.value.trim().toLowerCase(); resultsBox.innerHTML = ""; if (!query) { resultsBox.style.display = "none"; return; } const matches = pages .filter(p => p.name.toLowerCase().includes(query)) .sort((a, b) => a.name.toLowerCase().indexOf(query) - b.name.toLowerCase().indexOf(query) ); matches.forEach(match => { const li = document.createElement("li"); const a = document.createElement("a"); a.href = match.link; a.textContent = match.name; li.appendChild(a); resultsBox.appendChild(li); }); resultsBox.style.display = matches.length ? "block" : "none"; }); } }); <div class="search-container"> <input type="text" id="search" placeholder="Search…" autocomplete="off" /> <ul id="search-results"></ul> </div>
Read Entire Article