3

Webページに一連のボタンが表示されています。ボタンの1つをクリックすると、外部APIが呼び出される必要があります（おそらく、応答が受信され、ページ上の何かが更新されます）。

いくつかの追加情報：これらのボタンは部分的にページに配置され、ユーザーのリストの一部を構成します。ボタンは、リストされているユーザーをアクティブ化および非アクティブ化することを目的としています。この設定が私がやりたいことをするための最良のアプローチに影響を与えるかどうかはわかりませんので、言及する価値があると思いました。

これはどのように行う必要がありますか？ボタンは、Railsアプリ内のコントローラーへのリンクである必要がありますか？ボタンを押したときにページをリロードする必要はありませんか？そのリクエストをajaxにオフロードできますか？など。

私はこれに取り組む最善の方法を知りません、そしてどんなガイダンスも非常に貴重であることがわかります。

4

2 に答える 2

2

Ok。私はこれの良い実装を見つけたと信じています。

秘訣は、ボタンがクリックされたときに適切なコントローラーを押すために、ボタンをカプセル化するフォームを作成することです。私の場合、次のように、rails関数を使用して、Developerコントローラーの部分ビューform_tag内にボタンを生成しました。_list_item.html.erb

<div id=<%= list_item.id %>>
    <%= form_tag "/Developer/toggle", :method => "get", :remote => true do %>
    <p>
        <% if list_item.inactive? %>
        <%= submit_tag "Activate", :name => nil %>
        <input type="hidden" name="act" value="activate" />
        <% else %>
        <%= submit_tag "Deactivate", :name => nil %>
        <input type="hidden" name="act" value="deactivate" />
        <% end %>
    </p>
    <input type="hidden" name="dev_id" value=<%=list_item.id%> />
    <% end %>
</div>

このパーシャル内で注意を喚起すべき2つのことがあります。

  1. これはリストの一部として部分的にレンダリングされるため、JavaScriptがその要素のみに作用するように、各リストアイテムに一意のIDを指定する必要があります。これは最初の行で行われます。これは<div id=<%= list_item.id %>>、リスト内の各開発者が必ず一意のIDを持っているため、一意になることがわかっています。
  2. :remote => true関数に必要な引数form_forです。これにより、新しいページをロードするのではなく、バックグラウンドでリクエストが行われます。

このフォームは、送信されるDeveloper#toggleと、2つのパラメーターを使用してアクションにヒットします。actこれは、またはのいずれactivateかdeactivateであり、操作しidている開発者のIDです。これらのパラメータは両方とも、フォーム内の非表示フィールドです。

フォームが送信された後、コントローラー内で、正しい開発者のインスタンスを取得し（私の場合、それはかなり複雑ですが、ほとんどの場合、のようなものです@dev = Developer.find(id)）、アクティブ化/非アクティブ化に必要な手順を実行します開発者。

最後にtoggle.js.erb、開発者コントローラーのビューディレクトリ内にファイルを作成しました。このファイルは、コントローラーがタスクを完了するとレンダリングされます。このファイルは、要素を（パーシャルで指定した一意のIDを介して）取得し、次のようにパーシャルを再レンダリングすることで内部のhtmlを置き換えます。

document.getElementById("<%=escape_javascript(@dev.id)%>").innerHTML="<%=escape_javascript(render :partial => 'developer/list_item', :object => @dev) %>";

その結果、開発者のアクティブステータスが変更された後に部分的に再レン​​ダリングされ、適切なActivateまたはDeactivateボタンが表示されます。

この回答は、特にアクティブと非アクティブの切り替えに対処する必要がある特定のアプリケーションに非常に焦点を当てていることを認識していますが、簡単に簡略化でき、複雑さを必要としない他のケースに適応できると思います。

于 2012-07-05T22:55:34.753 に答える
0

Railsを使用してこのタスクを実行できますが、ページの更新を実行する必要があります。Javascript / AJAXを使用している場合は、ページを更新しないでください。例（jQuery）：

$(":button").click(function(){ 
  //Your Code here..
});

編集：上記はjQueryコードです。あなたがしたいのは、ボタンをクリックしたときに起こるアクションです。外部APIを呼び出したい場合は、ajaxを使用できます。jQueryでPOSTおよびGETのドキュメントを探します：http：//api.jquery.com/jQuery.post/およびhttp://api.jquery.com/jQuery.get/。Google forRailsjqueryチュートリアル。

于 2012-07-05T00:32:34.670 に答える