2012-03-02 17 views
6

タブが付いたページがあり、タブをクリックしたときにajaxでさまざまな部分をレンダリングしたいだけです。私はいくつかのコードを持っていますが、私はそれが最も効率的な方法ではないと思います。私は、誰かがすでに私のコードを手伝ってくれたらいいのか、それとももっと簡単な方法があればそれをたくさん感謝したいと思っていました。ありがとうございました!Rails:Ajaxで部分的にレンダリングする

HTMLタブ

<li class='StreamTab StreamTabRecent active'> 
<%= link_to 'Most Recent', mostrecent_schools_path, :remote => true, :class => 'TabText' %> 
</li> 


<div id='ContentBody'> 
<div id='ajax'></div> 
<%= render 'users/microposts', :microposts => @microposts %> 
</div> 

学校コントローラ

class SchoolsController < ApplicationController 
    def mostrecent 
    @school = School.find_by_slug(request.url.gsub('http://localhost:3000/','')).id 
    @microposts = @user.microposts.order('created_at DESC').paginate(:per_page => 3, :page => params[:page]) 
    respond_to do |format| 
     format.html 
     format.js 
    end 
    end 
end 

最近のJS

$("#ContentBody").html('<%= escape_javascript(render :partial => "users/microposts")%>'); 

ルート

resources :schools do 
    collection do 
     get :mostrecent 
    end 
    end 
+0

「私はいくつかのコードを持っているが、私はそれが最も効率的な方法だとは思いません」。上記のコードは正しく動作していますか?このプロセスを最適化したいのですか、最初に動作するコードが必要ですか? – prasvin

+0

@prasvinそのコードは動作していません。以前はインターネット上で見つけたものから動作させようとしていましたが、それをどうやって取得するのか、それが最も効率的な方法であるかはわかりません。これを行うより良い方法があるなら、私はすべての耳で学びます。 – Kellogs

答えて

10

は前のポストに私の答えを参照してください。これはあなたにアイデアを与えるでしょうAJAX in Rails: Show model#new form after completing a model#update

あなたができることは、アクションにjsonをレンダリングし、その部分をjsonとして渡します。

def mostrecent 
    @school = School.find_by_slug(request.url.gsub('http://localhost:3000/','')).id 
    @microposts = @user.microposts.order('created_at DESC').paginate(:per_page => 3, :page => params[:page]) 
    respond_to do |format| 
    format.json { render :json => {:success => true, :html => (render_to_string 'users/microposts')} } 
    format.html { } 
    end 
end 

あなたのJSでのJSON(例えばmostrecent.jsやmostrecent.js.coffeeとして、すなわちCoffeeScriptの/ javascriptのファイル)にアクセスし、現在の要素を置き換えることができます。

$('.TabText').live 'ajax:success', (event,data) -> 
    $('#ContentBody').html(data.html) if(data.success == true) 
+0

これは大変感謝しています:) – Kellogs

+1

上記がうまくいかなかったり、何かが分からない場合に書き返してください。コードはテストされていませんが、あなたの仕事を達成するのに非常に近くなるはずです。 – prasvin

+0

私は以前にjsonを使ったことはありませんが、jsファイルの代わりにjsonファイルを作成して追加します。 – Kellogs

2

プラナスの答えはスポットオンです。 JSの返却と実行はシンプルに見えるかもしれませんが、デバッグは非常に面倒です.AJAXを介して返されたJSにどのようにブレークポイントを設定しますか?代わりに、ページにすべてのJSを含めてデータを返すだけです。

0

私はレール4.2を使用して、答え@prasvin正しい方向に私を指摘したが、私は

format.json { render :json => {:success => true, :html => (render_to_string 'instruments')} } 

を使用したとき、私はエラーになるだろうよ「テンプレート...楽器がありません...」

読んだ後、私はこのコメントを見つけたrails render_to_string giving errors with partial view。以下のように、「楽器」:@marcelは、ファイルが部分的、部分的で指定する必要が言及

format.json { render :json => {:success => true, :html => (render_to_string partial: 'instruments')} } 
関連する問題