New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
UI: Allow to specify number of loaded results with triggerSearch method #571
Comments
I would like this too, if it allows to share prepared queries with other people as a link. |
The basic idea is to get the input field e.g. via its class and attach an event listener that replaces the history state with the modified URL. Then you can just call triggerSearch when the site loads. Maybe I'll put together an example that doesn't depend on my framework and internal code. |
window.addEventListener('DOMContentLoaded', (event) => {
const pagefindUi = new PagefindUI({ element: '#search' })
const url = new URL(location.href)
const input = document.querySelector('#search input')
input.addEventListener('input', updateUrlParameter)
const button = document.querySelector('#search button')
button.addEventListener('click', updateUrlParameter)
function updateUrlParameter(e) {
if (input.value) url.searchParams.set('q', input.value)
else url.searchParams.delete('q')
history.replaceState(history.state, '', url)
}
pagefindUi.triggerSearch(url.searchParams.get('q'))
}) |
Nice, the addition of a |
Thanks for the code sample @Dasbando - this works well for me! Any ideas anyone? |
I started implementing a query url parameter with the default UI on my website, so you can return to the results page to look at other results if you didn't find what you are looking for. The implementation isn't pretty, but it has mostly worked well. The only issue I encountered is that I have no way to tell the UI to load the same number of results that were loaded previously, so the user has to manually click "load more" and scroll to the result they looked at previously.
The text was updated successfully, but these errors were encountered: