如何将实时搜索添加到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实时搜索(过滤)
  • 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对象路径传递给您的数据选项。

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

在你的控制器中,你应该这样做。Order和Where可以在你的模型中(首选方式)声明为作用域。

  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

在实现上述内容后,我使用的工具是:自动完成

希望以上能有所帮助。如果不是这样的话,这一集应该会让你朝着正确的方向前进。

相关内容

  • 没有找到相关文章

最新更新