Rails：需要帮助构建基本的AJAX搜索表单并显示结果

Question

我正在尝试构建搜索表单，并且无法理解在特定情况下使用UJS的正确方法。我遇到的主要问题是我无法弄清楚如何在我的表单中选择参数并执行查询，然后返回搜索结果。

我希望能够从模型中选择几个“搜索条件”，我使用下拉选择元素和日期字段。在选择搜索项目来构建查询时，我想提交POST或GET请求，并通过ajax将结果返回并显示在搜索表单下方的列表中，而无需重新加载页面。

目前，我有一个名为具有路径设置为搜索静态页面：

match '/search', to: 'search#index' 

index.html.erb

<h1>Search</h1> 

<!-- search form --> 
<div id="search"> 
    <%= render 'form' %> 
</div> 

<!-- search results --> 
<div id="results"> 
</div> 

我有一个 '索引' 行动SearchController它负责处理所有项目集合，并将其放入使用collection_select（）方法构建的搜索表单下拉菜单中。

SearchController

class SearchController < ApplicationController 
    def index 
     # load up all the items to display as selectable search parameters to build query from 
     # Collections, Categories, Names 
     @collections = Collection.all 
     @categories = Category.all 
     @names = Name.all    
    end 

    def create 
    @collection = Collection.find(params[:collection][:id]) 
    @category = Category.find(params[:category][:id]) 
    @name = Name.find(params[:fullname][:id])  

    respond_to do |format| 
     format.html { redirect_to search_url } 
     format.js 
    end  
    end 
end 

我正在使用的部分的形式：_form.htm.erb

<%= form_tag({controller: "search"}, class: "search_form", remote: true) do %> 
    <%= label_tag("Categories: ") %> 
    <%= collection_select(:category, :id, @categories, :id, :name, {}, html_options = { multiple: false }) %> 

    <%= label_tag("Collections: ") %> 
    <%= collection_select(:collection, :id, @collections, :id, :title, {}, html_options = { multiple: false }) %> 

    <%= label_tag("Names: ") %> 
    <%= collection_select(:name, :id, @names, :id, :fullname, {}, html_options = { multiple: false }) %> 

    <%= submit_tag("Submit") %> 
<% end %> 

当我在页面提交表单我看到使用参数Ajax请求在Chrome控制台中。我试图给hash中的form_tag一个动作，但似乎无法找到路由，除非我在routes.rb文件中指定它。

防爆，

<%= form_tag({controller: "search", action: "create"}, class: "search_form", remote: true) do %> 

问：我需要有一个特殊的途径，如果我使用AJAX？

问：如何将参数带入任何名称的SearchController操作并对其执行操作？

我想首先能够在结果div中显示搜索查询条目作为文本，所以我知道该操作是如何工作的。我想我会用js/jQuery来追加提交给结果div的参数的值。

问：是否有另一种方法来做这样的事情？

Answer 1

强烈推荐去用这个方法： Search, Sort, Paginate with AJAX

顺便jQuery的方法.live（）的编写者已经过时，与.delegate（）jquery documentation .deleate()