div jquery 및 rails에 검색 결과로드

Question

내 레일 앱에는 사용자가 다른 사용자를 검색 할 수있는 검색 창이 있습니다. 현재 사용자가에서 검색을 제출하면 검색 결과 페이지로 리디렉션됩니다. 그 결과를 같은 페이지의 div에로드하고 싶습니다. 내 웹 사이트 탐색 링크를 사용하여이 작업을 수행 할 수 있었지만 jQuery 및 레일스에 익숙하지 않아이 작업을 이해할 수 없습니다.

내 jQuery를 내 탐색 링크에 해당 :

$(function() { 
    $('#links a').live('click', function() { 
     $('#pages').load(this.href).fadeIn('slow'); 
     return false; 
    }); 
}); 

내 검색 기능과 동일한 기능을 수행 할 내 시도 ...

$(function() { 
    $("input#search").parents("form").submit(function() { 
    $('#pages').slideUp('slow').load(this.href).slideDown('slow'); 
    return false; 
    }); 
}); 

어떤 도움이 많이 유용한 jQuery를 자습서와 함께 ~ 주시면 감사하겠습니다 초보자를위한!

내 양식 :

<div id="search_bar"> 
    <form action="/search" method="get"> 
    <input class="tb10" id="search" name="search" onclick="this.select();" type="text" value="Find Users" /> 
    </form> 
</div> 

Answer 1

또한 검색 기능에서 return false;보십시오. false를 반환하면 기본 이벤트가 요소에서 트리거되지 않습니다.

Answer 2

첫 번째 예에서는 href 요소가있는 앵커에 이벤트를 바인딩하여 어디에서 링크를 가져올 지 알 수 있습니다.

두 번째로 링크에 적용된 내용을 복사하여 붙여 넣은 것처럼 보입니다. 폼이 처리되는 곳 (폼의 동작)과 폼 데이터로 전달되는 내용을 알아야합니다. JQuery와에 다음과 같이 이루어집니다 : 내가 RoR에 매우 익숙하지 않다

$(function(){ 
    $("#search").submit(function(){ 
     var queryString = $(this).serialize(); //gets the values in your form 
     var url = $(this).attr("action"); //your action url 
     $("#pages").load(url+"?"+queryString).fadeIn('slow'); 
     return false; //this prevents your form from doing its default behavior. 
    }); 
}); 

(나는 #search 있으리라 믿고있어하면 검색 양식의 ID입니다)하지만, JQuery와 고체해야한다 :

희망이 도움이됩니다!

Answer 3

나는 지금 당신에게 RoR 예제를 줄 수 없지만 그 대답은 JQuery에 관한 것입니다.

기본적으로 나는 ajax 요청으로 검색 결과를 얻고 jquery Templates 나 Mustache와 같은 템플릿 시스템으로 그 결과를 보여줍니다. 레일에 대한 http://api.jquery.com/category/plugins/templates/ 콧수염 : https://github.com/adamsalter/mustache-rails