6

我是 Rails 的初学者程序员,我目前正在尝试创建一个简单的表单,其中包含姓名、电子邮件和电话号码,然后当您单击提交时,使用 Ajax 输入的内容更新页面。

即,如果您在表单的文本字段中输入用户、user@example.com 和 555-555-555 并单击提交,您应该得到

姓名:用户电子邮件: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 回答