0

このチュートリアルに従って、Rails3.1検索ボックスにAJAXを追加しました(すべて正常に機能します)。この検索ボックスはサイドバーにあり、結果をメインの列に表示したいと思います。私が遭遇する問題は、これを適切に行う方法がわからないことです。

AJAXの前は、結果を表示するコードを含むsearch.html.hamlがありました。ただし、ここにレンダリング部分呼び出しを追加すると、何も表示されません(search.html.hamlが呼び出されないためだと思います)

search.html.haml

=@events.count
#search=render 'search'

一方、renderpartial呼び出しをapplication.html.hamlに配置した場合。結果は表示されますが、メイン列の実際のコンテンツの下に表示されます。

application.html.haml

     #central
        %p#notice= notice
        = yield
        #search=render 'search'

簡単な修正だと思いますが、どうすればよいかわかりません。

前もって感謝します!!!

_search.html.haml

 -@events.each do |event|
   #user_block
     #user_block_pic
      = image_tag(event.pic.url(:medium), class: 'event_block_image', :alt =>'Event Picture')
      ....more stuff

search.js.erb

  $('#search').html("<%= escape_javascript( render(:partial => 'search') ) %>");

メイン列(#central)にあるものを取り除き、そこに結果を表示するにはどうすればよいですか?

修繕!!!!現在動作中です!!!! (回答を投稿できるようになるまで何時間も待たなければならないので、ここで行います)

これが正しいコーディングかどうかはわかりませんが、うまくいきました。私がしたことは、真ん中のファイルsearch.html.haml(上記を参照)を取り除くことです

そして今、構成はこれです:

application.html.haml

   #central
        %p#notice= notice
        = yield

_search.html.haml

#search
 =@events.count
 -@events.each do |event|
   ...stuff

アセット/javascript/search.js

 $(function(){ 
$("#search .pagination a").live("click", function(){   #this is for pagination
    $.getScript(this.href);
    return false;
});
$('#events_search').submit(function () {  #this is for the search form
    $.get(this.action, $(this).serialize(), null, 'script');
    return false;
  });
 });

views / events / search.js.erb

  $('#central').html("<%= escape_javascript( render(:partial => 'search') ) %>");

それは私にとってはうまくいきます。これが他の人を助けることができることを願っています。

ありがとう

4

1 に答える 1

0

検索メソッドがajax呼び出しから呼び出されると、レンダリングsearch.js.erbまたはhamlが必要になると思いますが、私はhamlを使用せず、erbのみを使用します。

次に、 を作成しますsearch.js.erb。ここに my の例を示しますsearch.js.erb

$("#user-browser").replaceWith("<%= escape_javascript render(:partial => 'list') %>");
$("#tabs-interval").replaceWith("<%= escape_javascript render(:partial => 'tabs-interval') %>");

したがって、私のerbが行うことは、jqueryを使用して、レンダリングされたパーシャルを使用してhtmlを更新したいdivを見つけ、その中のhtmlを置き換えることだけです。

私のパーシャルはerbで次のようになります:

ファイル: list.html.erb:

<div id="user-browser">
  <span>more html stuff</span>
</div>

ファイル: tabs-interval.html.erb:

<div id="tabs-interval">
  <span>more html stuff</span>
</div>
于 2012-04-20T15:49:02.457 に答える