Spaces:
Runtime error
Update search functionality with improved code
Browse filesThis commit updates the search functionality on the website with improved code that is more readable and maintainable. The code has been refactored to use more descriptive variable and function names, and comments have been added to clarify the purpose of each block of code. Template literals and encodeURIComponent have been used to ensure proper formatting of the search query parameter, and a check has been added to ensure that the search query is not empty before redirecting the user. This update should improve the user experience by providing more reliable and consistent search functionality. The code has been tested locally to ensure that it works as intended, and no changes were made to the UI or design of the search box and results page.
- public/static/index.js +21 -6
@@ -1,10 +1,25 @@
|
|
1 |
-
|
2 |
-
|
3 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
4 |
}
|
5 |
|
6 |
-
|
|
|
|
|
|
|
|
|
7 |
if (e.key === 'Enter') {
|
8 |
-
|
9 |
}
|
10 |
-
})
|
|
|
1 |
+
/**
|
2 |
+
* Selects the input element for the search box
|
3 |
+
* @type {HTMLInputElement}
|
4 |
+
*/
|
5 |
+
const searchBox = document.querySelector('input');
|
6 |
+
|
7 |
+
/**
|
8 |
+
* Redirects the user to the search results page with the query parameter
|
9 |
+
*/
|
10 |
+
function searchWeb() {
|
11 |
+
const query = searchBox.value.trim();
|
12 |
+
if (query) {
|
13 |
+
window.location.href = `search?q=${encodeURIComponent(query)}`;
|
14 |
+
}
|
15 |
}
|
16 |
|
17 |
+
/**
|
18 |
+
* Listens for the 'Enter' key press event on the search box and calls the searchWeb function
|
19 |
+
* @param {KeyboardEvent} e - The keyboard event object
|
20 |
+
*/
|
21 |
+
searchBox.addEventListener('keyup', (e) => {
|
22 |
if (e.key === 'Enter') {
|
23 |
+
searchWeb();
|
24 |
}
|
25 |
+
});
|