Algolia - 使用多个搜索框进行即时搜索
Algolia - Instant Search with multiple searchbox
我有以下HTML(简体)
<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>
我有一个索引列表,其中包含标题、城镇、描述等属性
对于第一个文本输入 (#keyWork),我希望第二个输入 (#town) 的可搜索属性为 "title"、"description" 和 "town"
我不知道如何让 2 个搜索框在不同的属性中搜索并且无法在任何地方找到示例。我尝试创建自定义小部件,但我不知道如何指定自定义属性而不是重写整个查询。
这是我目前所取得成果的一些代码示例
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'),
})
);
感谢您的帮助
有点晚了,忘记回答问题了
我尝试存档的内容无法使用 algolia 小部件实现,因此我使用了另一种 API 方法:
https://www.algolia.com/doc/api-reference/api-methods/search/
我有以下HTML(简体)
<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>
我有一个索引列表,其中包含标题、城镇、描述等属性
对于第一个文本输入 (#keyWork),我希望第二个输入 (#town) 的可搜索属性为 "title"、"description" 和 "town"
我不知道如何让 2 个搜索框在不同的属性中搜索并且无法在任何地方找到示例。我尝试创建自定义小部件,但我不知道如何指定自定义属性而不是重写整个查询。
这是我目前所取得成果的一些代码示例
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'),
})
);
感谢您的帮助
有点晚了,忘记回答问题了
我尝试存档的内容无法使用 algolia 小部件实现,因此我使用了另一种 API 方法: https://www.algolia.com/doc/api-reference/api-methods/search/