javascript - 如何将实时搜索添加到Rails 4.2？

我一直在尝试创建一个简单的搜索表单，该表单在Rails 4.2应用程序中响应AJAX。我尝试了所有可以找到的教程，但仍然无济于事。


http://railscasts.com/episodes/240-search-sort-paginate-with-ajax
http://aymeric.gaurat.net/2010/how-to-develop-live-search-textbox-in-ruby-on-rails/
Ruby on Rails Live Search (Filtering)，
https://www.youtube.com/watch?v=EqzwLUni2PM）


这是我的搜索方法：

  def self.search(search)
    search ? where('name LIKE ?', "%#{search}%") : all
  end

我在控制器上的索引操作：

  # GET /ticket_types
  # GET /ticket_types.json
  def index
    @ticket_types = TicketType.search(params[:search]).order(sort_column + " " + sort_direction).paginate(per_page: 10, page: params[:page])
    respond_to do |format|
      format.html {render 'index'}
      format.json {render json: @ticket_types.map(&:name)}
    end
  end

我的过滤器：

  <form>
    <fieldset>
      <legend>Filter</legend>
        <%= form_tag path, remote: true, method: 'get', id: id do %>
          <%= hidden_field_tag :direction, params[:direction] %>
          <%= hidden_field_tag :sort, params[:sort]%>
          <p>
            <%= text_field_tag :search, params[:search], id: 'filter_search_autocomplete', data: {autocomplete_source: ticket_types_path} %>
            <%= render 'button_submit', name: nil, id:"search_button" %>
          </p>
        <% end %>
      </fieldset>
    </form>

提交按钮：

  <%= submit_tag "Search", name: name, class: 'button', id: id, remote: true %>

我的ticket_types.coffee

jQuery ->
  $('#filter_search_autocomplete').autocomplete
  source: $('#filter_search_autocomplete').data('autocomplete-source')

而我的索引偏：

<p id="notice"><%= notice %></p>

<%= render 'registry_filter', path: ticket_types_path, id: "ticket_search_filter" %>
<%= render 'ticket_types' %>
<br>
<section id="content-area"></section>
<div>
  <%= render 'button_link', button_name: "Create", path: new_ticket_type_path, id: 'create' %>
  <%= render 'button_link', button_name: "Back", path: ticket_types_path, id: 'back_button' %>
</div>

关于如何拥有像Facebook这样的实时搜索框的任何想法？例如，我希望用户每次在盒子上键入一个字母时，它都会显示大约5个包含给定单词的注册表的结果，然后将该搜索资产用作部分内容，以便能够在其他模型上使用应用程序。提前致谢！

最佳答案

我所做的事情与您要完成的工作非常相似。

如果您将所有内容存储在数据库中，那么我要做的一件事就是在rails控制器中将数据转换为json。

将数据转换为json后，只需在rails表单中创建输入字段即可，其中将具有自动完成功能。

在下方，您应该将json对象路径传递给data选项。

例：
<%= f.text_field :some_name, data: {autocomplete_source: some_name_path} %>

在您的控制器中，您应该执行类似的操作。可以在模型中（首选方式）将范围和位置声明为范围。

  def index
    @some_name = SomeName.order(:field_name).where("feild_name like ?", "%#{params[:term]}%")

    respond_to do |f|
      f.json { render json: @some_names.map(&:field_name) }
    end
  end

实现上述功能后，我使用的工具是：autocomplete

希望以上内容对您有所帮助。如果没有，这集railscast应该会让您朝正确的方向前进。