Новичок здесь, с некоторыми трудностями в реализации автозаполнения с использованием Searchkick и Typeahead / bloodhound.
Прежде всего, у меня есть домашняя страница index / welcome, где у меня есть поле ввода для окна поиска.Затем выполняется поиск по нескольким моделям названий разных ячеек и разных клеточных маркеров (для этого не важно).
Прежде всего, в моем файле маршрутов, я не уверен, что мое автозаполнение будет «присоединено» к моему «приветственному» маршруту или моему маршруту «Ячейки», я пробовал оба, но, похоже, не получилосьразница, в настоящее время она установлена следующим образом:
resources :cells do
collection do
match 'autocomplete' => 'welcome#autocomplete', via: [:get], as: :autocomplete
end
end
resources :welcome #index / home page
моя форма ввода:
<%= form_tag(@Search, :action => 'index', :method => "get", id: "search-form") do %>
<%= text_field_tag(:q, nil, placeholder: "Search...", class: "form-control rounded-left typeahead", autocomplete: "off") %>
<% end %>
Моя модель выглядит следующим образом:
searchkick text_start: [:name], callbacks: :async, suggest: [:name], word_start: [:name]
и мой контроллерaction:
def autocomplete
render json: Cell.search(params[:q], {
fields: ["name^5"],
autocomplete: true,
limit: 5,
load: false,
misspellings: false
}).map(&:name)
end
наконец-то javascript:
<script src="typeahead.bundle.js"></script>
<script>
var Cells = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.whitespace,
queryTokenizer: Bloodhound.tokenizers.whitespace,
remote: {
url: '/welcome/autocomplete?query=%QUERY',
wildcard: '%QUERY'
}
});
$('#typeahead').typeahead(null, {
source: Cells
});
</script>
Полагаю, я просто очень запутался в том, как правильно это настроить, я считаю, что документы Searchkick трудноэкстраполирую на мои цели, так как я довольно новичок во всем этом :) Если кто-то сможет помочь или указать мне хорошее руководство (которому не много лет), это было бы удивительно, так как я уверен, что япросто ходить по кругу.Это лучший способ реализовать автозаполнение или есть лучший способ сделать это?
Спасибо за чтение и спасибо за любую помощь:)