Algolia 使用 select2 自动完成 js

Question

我正在使用 aloglia autocomplete.js 并按照教程进行操作。我想将自动完成文本框与其他 select2 selectbox 一起使用。

var client = algoliasearch('YourApplicationID','YourSearchOnlyAPIKey')
var index = client.initIndex('YourIndex');
autocomplete('#search-input', { hint: false }, [
{
  source: autocomplete.sources.hits(index, { hitsPerPage: 5 }),
  displayKey: 'my_attribute',
  templates: {
    suggestion: function(suggestion) {
      return suggestion._highlightResult.my_attribute.value;
    }
  }
}
]).on('autocomplete:selected', function(event, suggestion, dataset) {
console.log(suggestion, dataset);
$("#search-input").val(suggestion.full_name.name)
});

问题是当我点击自动完成框旁边的任何地方时自动完成消失，它只显示我之前输入的内容。

我不想让它消失。我该如何实施？感谢您的帮助。

详细问题请看下面的例子

Assume you have a simple form with one auto complete input field,two select2 boxes and one submit button. After you choose auto complete filed, when you click anywhere, it changed to default text. I mean, you put "piz" and it shows "pizza". Therefore you select pizza and it display "pizza".Then, you try to choose one select2 box or click anywhere. The autocomplete input field changed back to "piz".

我尝试了 autocomplete:closed , $("#search-input").focusout 来设置输入字段，但它只是变回了我的查询。

Answer 1

要防止它消失，您可以使用autocomplete.js的debug选项：

autocomplete('#search-input', { hint: false, debug: true }, [ /* ... */ ]);

complete options list 在 GitHub 可用。

Answer 2

现在我有了。当你只需要 select 而不需要做任何操作时，你可以安全地删除 autocomplete:selected。并确保您的显示键是值而不是对象。

省去了我的麻烦。

Algolia 使用 select2 自动完成 js

Algolia autocomplete js with select2

autocomplete

algolia