11

Rails 3 アプリに Ajax 機能を追加しようとしています。

具体的には、Ajax リクエストを送信してコントローラー内のリモート関数を呼び出すボタンが必要です。このボタンは、その後 API を照会し、JSON オブジェクトをページに返します。

JSON オブジェクトを受け取ったら、内容を表示したいと思います。

これらすべては、新しい Rails 3 UJS アプローチでも行われます。このオンラインの良い例/チュートリアルはありますか? 私はグーグルでそれを見つけることができませんでした。ボタンをエントリ ポイントとして使用する単純な例 (つまり、ユーザーがボタンをクリックしてこのプロセスを開始する) も機能します。

編集 別のアプローチでこれを試してみましょう。このボタンで、JSON を返す外部 API に対してクエリを実行し、その JSON をページに表示したいと考えています。どこから始めればいいのかわからない。ボタン自体が外部 API を照会しますか? コントローラーを経由して、コントローラーに外部 API のクエリを実行させ、JSON を取得し、JSON をこのページに返す必要がありますか? この JSON のコンテンツを表示/アクセスするにはどうすればよいですか? 正直なところ、Rails 3.x で JSON を処理する良い例が見つかりません...

4

3 に答える 3

10

これが始まりです：

まず、ビューで link_to メソッドを使用してボタンを作成します。次に例を示します。

=link_to "delete", "#{invitation_path(invitation)}.json", :method=>:delete, :remote=>true, :class=>"remove", :confirm=>'Are you sure you?'

リソースの URL に「.json」を追加していることに注意してください。これは、パラメータの意味を確認するための AJAX 削除、google link_to の単なる例です。パラメーター :remote を true に設定して HTTP 要求を行う場合の概念、つまり、これはブラウザーからの AJAX 呼び出しに変換されます。

次に、ユーザーが手順 1 の link_to をクリックしたときにブラウザが行う AJAX 呼び出しの結果を処理できるように、JavaScript を記述します。詳細については、次のブログ投稿を参照してください: http://www.alfajango .com/blog/rails-3-remote-links-and-forms/

私のサイトの例:

jQuery(function($) {
  // create a convenient toggleLoading function
  var toggleLoading = function() { $("#loading").toggle() };

  $("#pending_invitation")
    .live("ajax:loading",  toggleLoading)
    .live("ajax:complete", toggleLoading)
    .live("ajax:success", function(event, data, status, xhr) {
       var response = JSON.parse(xhr.responseText)
       if (response.result == "ok") {
          $(this).fadeOut('fast');
       }
       else {
         var errors = $('<div id="error_explanation"/>');
         errors.append('<h2>Pending invitation action error</h2><ul><li>' + response.error + '</li></ul>');
         $('#new_invitation_error').append(errors)   
       }
    });
});

返された json を解析し、それに基づいてページの html を変更していることがわかります。この js は、ここには含まれていないトップ ビューで定義された CCS ID とクラスを使用することに注意してください。

独自のコントローラーを作成して json を吐き出したい場合は、次の例をご覧ください。

class InvitationsController < ApplicationController
  respond_to :html, :json

  # other methods here
  # ...

  def destroy
    @invitation = Invitation.find(params[:id])
    respond_to do |format|
      if @invitation
        @invitation.destroy
        flash[:success] = I18n.t 'invitations.destroy.success'
        format.json { render :json =>{:result => "ok", :message=>"Invitation #{params[:id]} was destroyed", :resource_id=>params[:id] } }
      else
        format.json { render :json => { :result=>"failed", :error=>"Cannot find Invitation #{params[:id]}", :resource_id=>params[:id] } }
      end
    end
  end
end

この助けを願っています。

于 2011-04-26T19:17:02.773 に答える
6

古い質問ですが、Ajaxifying Rails アプリケーションの本当に良い概要は次のとおりです。

Rails 3.1 での Ajax - ロードマップ

于 2012-01-27T07:27:12.760 に答える
1

次の形式でエラーを返すことも検討してください。

render :json => @myobject.to_json, :status => :unprocessable_entity

これにより、クライアントは応答をエラーとして処理できるようになります。

于 2013-03-23T18:15:36.580 に答える