I have been trying to figure this out for about an hour. It’s from a CodeAcademy snipet that I just can’t seem to get to work. All other functions are functional, but this one keeps failing with the same error. Maybe I just need to walk away and try again tomorrow but I figured I’d ask the hive brain here.
// Click handler for search button
const captureSearchValue = () => {
const searchInput = document.getElementById("search-bar"); // Corrected ID
return searchInput ? searchInput.value.trim() : "";
};
// Filter books based on search input
const filterBooks = (books, searchValue) => {
return books.filter((book) => {
// Flatten the book object into a single array
const valuesArray = flattenObjectValuesIntoArray([book])[0];
return valuesArray.includes(searchValue);
});
};
// Empty the book list container, iterate over list of filtered books,
// return list of books formatted as HTML using the function in `helper.js`
const structureBooksAsHtml = (filteredBooks) => {
// Assuming structureBookAsHtml is defined in helper.js
return filteredBooks.map((book) => structureBookAsHtml(book));
};
// Handler triggered when a user clicks the "Search" button
const searchBtnClickHandler = (books) => {
const searchValue = captureSearchValue();
const filteredBooks = filterBooks(books, searchValue);
const bookHtmlArray = structureBooksAsHtml(filteredBooks);
renderBooksToDom(bookHtmlArray);
};
// Grab search button from the DOM
const searchBtn = document.getElementById("search-btn");
// Attach an event listener to the search button
searchBtn.addEventListener("click", () => {
searchBtnClickHandler(books);
});
The filterBooks() function takes in a search string and a list of books as parameters and returns all of the books that contain an exact match of the search input as an array of objects. Objects in this array should be formatted as books with title, author, and tags properties, similar to the original books array. It should use the flattenObjectValuesIntoArray() function to search all fields within a book object easily.
There was an error with the function `filterBooks`. Please check that it was defined correctly.
Above is where I’m at so far. Some of the changes I’ve tried make all other functions fail, and others don’t seem to do anything at all.
Requirements:
The captureSearchValue function captures the search bar input value and returns it. (complete)
The filterBooks() function takes in a search string and a list of books as parameters and returns all of the books that contain an exact match of the search input as an array of objects. Objects in this array should be formatted as books with title, author, and tags properties, similar to the original books array. It should use the flattenObjectValuesIntoArray() function to search all fields within a book object easily. (incomplete)
There was an error with the function filterBooks
. Please check that it was defined correctly.
The structureBooksAsHtml() function takes a list of books as a parameter, iterates over the list, formats them as HTML using the structureBookAsHtml() helper function, and returns an array of formatted book elements. (complete)
The searchBtnClickHandler() function is triggered when a user clicks the search button. It takes in a list of books as a parameter and integrates the individual functions that make up the app to render a list of books to the DOM that matches the search input when the search button is clicked. (complete)