Question

我正在使用Searchkick gem和typeahead.js为我的搜索输入组合自动完成功能。继宝石tutorial之后，我设法按照指示设置我的模型，控制器和路线：

餐厅模特

class Restaurant < ActiveRecord::Base
  searchkick text_start: [:name], autocomplete: [:name], suggest: [:name]

  def search_data
    { name: name }
  end
end

搜索控制器

class SearchController < ApplicationController
  def index
    if params[:query].present?
      @restaurants = Restaurant.search(params[:query], suggest: true)
    else
      @restaurants = []
    end
  end

  def autocomplete
    render json: Restaurant.search(params[:query], autocomplete: true, limit: 10).map(&:name)
  end
end

路线

resources :search, :only => [:index] do
  member do
    get :autocomplete
  end
end

搜索部分

<%= form_tag search_index_path, method: :get do |f| %>
    <%= text_field_tag :query, params[:query], id: "autocomplete" %>
    <%= submit_tag "Search" %>
<% end %>

我有一种感觉，那就是给我带来麻烦的JS。我松散地关注了宝石页面上的docs和一些SO帖子，这就是我最终的结果：

$(function() {
  var restaurants = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('restaurant'),
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    remote: { "url":"/search/autocomplete?query=%QUERY" }
  });

  restaurants.initialize();

  $('#autocomplete').typeahead(null, {
    displayKey: 'name',
    source: numbers.ttAdapter()
  });
});

注意这一行：

remote: { "url":"/search/autocomplete?query=%QUERY" }

回到视图中，一旦我开始在输入框中输入，我就会收到此错误：

GET http://localhost:3000/search/autocomplete?query=%QUERY 400 (Bad Request)

此外，我在控制台中收到此错误：

ERROR bad URI `/search/autocomplete?query=%QUERY'.

QUERY未进行插值。我该如何解决这个问题？

Answer 1

var restaurants = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('restaurant'),
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    remote: { 
        url: "/search/autocomplete?query=%QUERY",
        wildcard: "%QUERY"
    }
});

https://github.com/twitter/typeahead.js/issues/1219

此外，您可能需要修复控制器，以便返回空的ActiveRecord :: Relation对象而不是空数组。

def index
   if params[:query].present?
     @restaurants = Restaurant.search(params[:query], suggest: true)
   end
   @restaurants ||= Restaurant.none
end

请参阅http://apidock.com/rails/ActiveRecord/QueryMethods/none

带有typeahead.js的Rails - 400（错误请求）

1 个答案: