레일 : 기본 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 %> 

내가 PARAMS와 아약스 요청을 참조 Chrome 콘솔에서 form_tag 해시 작업을 제공하려고했지만 routes.rb 파일에서 지정하지 않으면 경로를 찾을 수 없습니다.

예,

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

Q : 나는 아약스를 사용하고 있다면 특별한 경로가해야합니까?

Q : 어떤 이름의 SearchController 액션에 매개 변수를 가져 와서 어떻게 처리합니까?

먼저 검색 쿼리 항목을 결과 div에 텍스트로 표시하고 싶습니다. 따라서 작업의 작동 방식을 알 수 있습니다. js/jQuery를 사용하여 결과 div에 제출 된 params의 값을 추가한다고 가정합니다.

Q : 이와 비슷한 방법이 있습니까? 강하게

Answer 1

이 접근 방식으로 이동하는 것이 좋습니다 : Search, Sort, Paginate with AJAX

그런데 JQuery와 방법 .live()를하는 저자 사용하여 오래된 및 .delegate()