I have the following HTML (simplified)
<form action="#" method="post">
<input type="text" class="form-control" name="keyWord" id="keyWord" placeholder="key Word">
<input type="text" id="town" class="form-control" name="town" placeholder="town">
<button id="form_button" type="submit" class=""><i class="icon-search"></i></button>
</form>
I have one indice list with attributes such as title, town, description etc
For the first text input (#keyWork) I'd like the searchable attributes to be "title" and "description" and "town" for the second input (#town)
I don't know how to have 2 searchbox that search inside different attribute and can't find an example anywhere. I tried to create a custom widget but I don't know how to specify the custom attribute instead of rewriting the entire query.
Here some code example of what I have achieved so far
const searchClient = algoliasearch( /* keys */ );
const search = instantsearch({
indexName: 'my_index_name',
searchClient: searchClient,
});
const renderCustomTown = (renderOptions, isFirstRendering) => {
const {
items,
currentRefinement,
refine,
clearMapRefinement,
widgetParams,
} = renderOptions;
element.addEventListener('input', event => {
refine(event.target.value)
}); /* Specify attributes here ? */
}
// Create the custom widget
const searchTown = instantsearch.connectors.connectSearchBox(
renderCustomTown
);
search.addWidget(
searchTown({
element: document.querySelector('#town'),
})
);
Thank you for your help
A little bit late, I forgot to answer my questions
What I was trying to archive was not possible with algolia widget, so I used another API metho: https://www.algolia.com/doc/api-reference/api-methods/search/