0

多くのユーザーがいる 1 つのタスクを作成するために 1 つのフォームを追加するボタンを作成しようとしています。

$("#more").click(function(){
    i++;
    $("#more").after("<%= select_tag 'user_id_"+i+"',options_for_select(User.all.map { |u| [u.email,u.id] }) %>");

});

これは通常のように見えますが、これは Rails のタグの生成であり、次のように表示されます。

< %= select_tag 'user_id_4',options_for_select(User.all.map { |u| [u.email,u.id] }) %><%= select_tag 'user_id_3',options_for_select(User.all.map { |u| [u.email,u.id] }) %><%= select_tag 'user_id_2',options_for_select(User.all.map { |u| [u.email,u.id] }) %>

このコードを Rails に表示するにはどうすればよいですか?

アップデート：

コード jquery を .html.erb に入れようとすると、これは実行されません。以前は application.js にありました。

<script type="text/javascript">
$(document).ready(function() {

    var i = 1;
    $("#more").click(function(){
        i++;
        $("#more").after("<%= select_tag 'user_id_"+i+"',options_for_select(User.all.map { |u| [u.email,u.id] }) %>");

    });


});


</script>
4

1 に答える 1

1

何かを試してみましょう。それは大雑把な推測ですが、あなたのニーズに答えてくれることを願っています。これを新しいアプリケーションで試すことができます。ユーザーモデルを作成し、いくつかのデータをシードして、アセット グループに gem 'jquery-rails' を追加するだけです。サーバーを実行bundle installして再起動します。

assets/javascripts/application.jsに、少なくとも次の行があることを確認します。

//= require jquery
//= require jquery_ujs
//= require_tree .

users_controller.rbで、データベースからすべてのユーザーを取得し、インデックステンプレートをレンダリングするindexメソッドを定義します。次のようにするだけで非常に簡単です。

def index
  @users = User.all

  respond_to do |format|
    format.html
    format.js
  end
end

次に、 views/usersでビュー ファイルを編集し、必ずindex.html.erbという名前にします。このビューは、ブラウザで localhost:3000/users にアクセスしようとすると表示されます (詳しくは、GET HTML リクエストです)。通常と同じ方法で、ビュー内に HTML を記述し、Ruby を埋め込みます。今のところ、単に div を作成し、それに「more」という ID を指定して、属性を含むリンクを配置します。remote

<%= link_to 'click me', users_path, remote: true %>

次に、 views/usersに新しいビュー ファイルを作成し、index.js.erbという名前を付けます。拡張子が変更されたことに気づきました。現在は html.erb の代わりに js.erb を使用しています。詳細: ページがusers#indexルートに対してJavaScript リクエスト (この場合は GET JS) を実行すると、 index.js.erbビューで応答します。ここでの大きな利点は、ブラウザで実行される JavaScript コードをこのビューに記述できることです。

remote: trueリンクを追加したことを覚えていますか? これは、レールに JS リクエストを行うリンクを一般化するように指示します。魔法。

したがって、 views/users/index.js.erbファイルに JavaScript コードを記述するだけです。非常に単純なものから始めましょう。

alert('Hello');

自分のページ (通常は localhost:3000/users) に移動し、[クリックしてください] リンクをクリックすると、javascript 警告ボックスが表示されます。

2 番目のテストを行い、いくつかの Ruby コードを統合しましょう。これにより、 views/users/index.js.erbの内容を変更します。

alert('Ruby compute: <%= 1+1 %>');

Web ページには、テスト「Ruby compute: 2」のアラートが表示されます。この手法をアプリケーションのケースに合わせて調整するだけで済みます。

同じテクニック (ただし、より良い説明付き) は、この railscast で見つけることができます: http://railscasts.com/episodes/136-jquery

于 2013-03-19T12:41:28.310 に答える