An autocomplete engine for Alpinejs
npm install @alpinebricks/autocompleteAn autocomplete engine
Include the Alpinejs lib in your html:
``html`
Include the component:
`html`
Initialize it:
`html`
Use it in html:
`html`
x-on:input.debounce.500="$ac.search('http://localhost:8080/search.html', '#results')"
x-model="$ac.searchTerm" />
Loading...
- search(url: string, destSelector: string): run the search queryresetSearch(idDest: string))
- : reset the search results arearesetInput(idDest: string)
- : reset the search input contentresetAll(inputIdDest: string, searchIdDest: string)
- : reset both search area and input
- searchTerm: the current searched termisLoading
- : true if the search is running
- hasResults: true if the search term is not null and the search has finished loading
A custom result-loaded event is fired when the search result is available. To use it in html:
` To use it in javascript:html
`javascript``
window.addEventListener("result-loaded", function (evt) {
console.log("result loaded event was triggered")
// ...
})