6

私はRailsの初心者プログラマーであり、現在、名前、電子メール、電話番号を受け取る簡単なフォームを作成しようとしています。次に、[送信]をクリックすると、Ajaxを使用して入力した内容でページが更新されます。

つまり、フォームのテキストフィールドにUser、user @ example.com、および555-555-555と入力し、[送信]をクリックすると、次のようになります。

名前：ユーザーEメール：user@example.com電話番号：555-555-555

これは簡単な質問ですが、JavaScriptを作成して機能させる方法がよくわかりません。

パーシャルのコードは次のとおりです。

<%= form_for(@user, :remote => true) do |f| %>

Name: <div="Name"><%= f.text_field :name %></div>
Email: <div="Email"><%= f.text_field :email %></div><br/>
Phone Number: <div="Phone Number"><%= f.text_field :phone_number%></div><br/>
<%= f.submit "Submit" %>

私のコントローラーは次のようになります。

class UsersController < ApplicationController

def new
    @user = User.new
end

def create
    @user = User.new(params[:user])
end
end

create.js.erbファイルで、.update関数を使用してテキストフィールドを入力した情報に置き換えますか、それとも他のことをしますか？

4

2 に答える 2

11

フォームを div でラップすると、後でその内容を簡単に置き換えることができます。

<div id="theform">
<%= form_for(@user, :remote => true) do |f| %>

Name: <div="Name"><%= f.text_field :name %></div>
Email: <div="Email"><%= f.text_field :email %></div><br/>
Phone Number: <div="Phone Number"><%= f.text_field :phone_number%></div><br/>
<%= f.submit "Submit" %>
</div>

次に、create.js.erb ファイルで次のようにします。

$("#theform").html("<%= escape_javascript(render partial: "users/user", locals: {user: @user}) %>");

そして、あなたの /app/views/users/_user.html.erb で

Name: <%= user.name%> Email: <%= user.email%> Phone Number: <%= user.phone%>
于 2012-06-21T18:40:49.020 に答える
1

フォームでリモート true に到達し、コントローラーが js に応答するようにします

意見：

<%= form_for(@user, :remote => true) do |f| %>
  Name: <div="Name"><%= f.text_field :name %></div>
  Email: <div="Email"><%= f.text_field :email %></div><br/>
  Phone Number: <div="Phone Number"><%= f.text_field :phone_number%></div><br/>
<%= f.submit "Submit" %>

コントローラ：

class UsersController < ApplicationController

  def create
    @user = User.new(params[:user])
    @user.save
    respond_to do |format|
      flash[:notice] = "saved successful"
      format.js # new.js.erb 
    end
  end
end

ajaxコードでnew.js.erbという名前の新しいファイルを作成し、好きなようにRuby埋め込みsintaxを使用します

$('div#my_id').html('<%= @user.name%> - <%= @user.phone %>');
$('div#notice').html('<%= flash[:notice] %>');
于 2012-06-21T18:54:42.923 に答える