Javascript 在Rails 3中处理js.erb文件-续集_Javascript_Ruby On Rails 3_Jquery_Unobtrusive Javascript

Javascript 在Rails 3中处理js.erb文件-续集

javascript ruby-on-rails-3 jquery

Javascript 在Rails 3中处理js.erb文件-续集,javascript,ruby-on-rails-3,jquery,unobtrusive-javascript,Javascript,Ruby On Rails 3,Jquery,Unobtrusive Javascript,我最终将Rails应用程序CRUD转换为AJAX，因为只有一个页面刷新，所有控制器操作：创建、删除和编辑/更新都由AJAX驱动。真的很整洁。还有两个遗留问题：我被困在屏幕顶部的更新模式中，因为我无法更改submit按钮的模式，我希望在每次操作后创建它，编辑除外。我如何做到这一点-是通过使用JQuery或一些控制器操作更改屏幕来实现的第二个问题看起来简单得多。当我将必填字段留空时，应用程序会抛出一个错误条件，这是应该的。在相关的js.erb文件中，create.js、erb和update.js

我最终将Rails应用程序CRUD转换为AJAX，因为只有一个页面刷新，所有控制器操作：创建、删除和编辑/更新都由AJAX驱动。真的很整洁。还有两个遗留问题：

我被困在屏幕顶部的更新模式中，因为我无法更改submit按钮的模式，我希望在每次操作后创建它，编辑除外。我如何做到这一点-是通过使用JQuery或一些控制器操作更改屏幕来实现的

第二个问题看起来简单得多。当我将必填字段留空时，应用程序会抛出一个错误条件，这是应该的。在相关的js.erb文件中，create.js、erb和update.js.erb将采用错误路径，但屏幕上不会出现错误

我在下面列出了相关文件-Customers Controller，以及Customer视图下的各种html.erb和js.erb文件

客户控制员：

 class CustomersController < ApplicationController

  before_filter :load

  def load
    @customers = Customer.all
    @customer  = Customer.new
  end

  # Display composite form used for AJAX operations.

  def index   
  end




  # This method implements customer create action for AJAX request.

  def create  
    @customer = Customer.new(params[:customer])
    if @customer.save
      flash[:notice] = "Customer Record Created."
      @customers = Customer.all
      respond_to do |format|
        format.js
      end
    end 

  end 


  # This method get customer for editing using AJAX.

  def edit
    @customer = Customer.find(params[:id])

    respond_to do |format|
      format.js
    end
  end

  # This method implements customer update from AJAX form.

  def update
    @customer = Customer.find(params[:id])
    if @customer.update_attributes(params[:customer])
      flash[:notice] = "Customer Record Updated."
      @customers = Customer.all
      respond_to do |format|
        format.js
      end 
    end
  end  

  # This method implements customer delete from AJAX form.
  def destroy
    @customer = Customer.find(params[:id])
    @customer.destroy
    flash[:notice] = "Customer Record Deleted"
    @customers = Customer.all
    respond_to do |format|
      format.js
    end

  end

  # This method lists all customers on file. 

  def getcustsjson
    render :json => @customers
  end

  # This method lists all the books purchased by a particular customer.

  def getbooksjson

    @customer = Customer.find(params[:id]) 
    @order = @customer.order
    @orderitems = Orderitem.find_all_by_order_id(@order)
    @book = Book.find_all_by_id(@orderitems)

    render :json => @book 

  end 

end

索引表格：

<div id="customer_form"><%= render 'form' %></div>
<div id="customers_list"><%= render 'customers' %></div>

_带有提交按钮的部分表单：

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


  <div id="customer_errors" style="display:none"></div>

  <div class="field">
    <%= f.label :firstname %>
    <%= f.text_field :firstname %>
    <%= f.label :lastname %>
    <%= f.text_field :lastname %>
  </div>
  <div class="field">
    <%= f.label :email %>
    <%= f.text_field :email %>
    <%= f.label :phone %>
    <%= f.text_field :phone %>
  </div>
  <div class="field">
    <%= f.label :password %>
    <%= f.text_field :password %>
    <%= f.label :address_id %>
    <%= f.text_field :address_id %>
  </div>
  <div class="actions">
    <%= f.submit %>
  </div>
<% end %>

_部分客户：

<table>
  <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Email</th>
    <th>Phone</th>
    <th>Password</th>
    <th>Address</th>
    <th></th>
    <th></th>
    <th></th>
  </tr>

<% @customers.each do |customer| %>
  <tr>
    <td><%= customer.firstname %></td>
    <td><%= customer.lastname %></td>
    <td><%= customer.email %></td>
    <td><%= customer.phone %></td>
    <td><%= customer.password %></td>
    <td><%= customer.address_id %></td>
    <td><%= link_to 'Edit', edit_customer_path(customer), :remote => true %></td>
    <td><%= link_to 'Destroy', customer, :remote => true, :confirm => 'Are you sure?', :method => :delete %></td>
  </tr>
<% end %>
</table>

创建.js.erb文件，错误代码为：

<% if @customer.errors.any? -%> 

   /* Hide the Flash Notice div */
   $("#flash_notice").hide(300);

   /* Update the html of the div customer_errors with the new one */
   $("#customer_errors").html("<% @customer.errors.full_messages.each do |msg| %>
                              <li><%= escape_javascript ( msg ) %></li> 
                              <% end %>");

   /* Show the div customer_errors */
   $("#customer_errors").show(300);

<% else -%>

   /* Hide the div customer_errors */
   $("#customer_errors").hide(300);

   /* Update the html of the div flash_notice with the new one */
   $("#flash_notice").html("<%= flash[:notice] %>");

   /* Show the flash_notice div */
   $("#flash_notice").show(300);

   /* Clear the entire form */
   $(":input:not(input[type=submit])").val("");

   /* Replace the html of the div customers_list with the updated new one */
   $("#customers_list").html("<%=  escape_javascript render('customers') %>");

   <% end %>

Edit.js.erb代码：

$("#customer_form").html("<%= escape_javascript render('form') %>");

Update.js.erb代码，错误代码：

<% if @customer.errors.any? -%>
   $("#flash_notice").hide(300);
   $("#customer_errors").html("<% @customer.errors.full_messages.each do |msg| %>
                              <li><%= escape_javascript ( msg ) %></li> 
                              <% end %>");
   $("#customer_errors").show(300);
<% else -%>
   $("#customer_errors").hide(300);
   $("#flash_notice").html("<%= flash[:notice] %>");
   $(":input:not(input[type=submit])").val("");
   $("#customer_form").html("<%= escape_javascript render('form') %>");
   $("#customers_list").html("<%= escape_javascript render('customers') %>");
<% end %>

最后是Destroy.js.erb，我需要在执行后重置它以创建模式：

$("#customer_errors").hide(300);
$("#flash_notice").html("<%= flash[:notice] %>");
$("#flash_notice").show(300);
$("#customers_list").html("<%= escape_javascript render('customers') %>");



$("#customer_form").html("<%= escape_javascript render('form') %>");

如果还需要什么，请询问

编辑：

我现在还有一个问题，编辑操作不能正常工作。查看日志可以正确地发布事务，但响应会保持表单顶部不变，而不是显示要更新的记录的详细信息。我已经粘贴了最新的控制器代码

编辑二：

现在的问题似乎是没有处理customer\u错误和customer\u表单div的DOM更新。相比之下，对customer_list div的所有更新都得到了很好的处理。我在下面列出了这两种消息的响应内容，以及浏览器中的源代码列表，其中显示了各种div

来自浏览器的源是：

<!DOCTYPE html>
<html>
<head>
  <title>OnlineBookStore</title>
  <link href="/stylesheets/scaffold.css?1323327452" media="screen" rel="stylesheet" type="text/css" />
  <script src="/javascripts/jquery.js?1323855673" type="text/javascript"></script>
<script src="/javascripts/jquery-ui.js?1323855673" type="text/javascript"></script>
<script src="/javascripts/jquery_ujs.js?1323855673" type="text/javascript"></script>
<script src="/javascripts/application.js?1323327452" type="text/javascript"></script>

  <meta name="csrf-param" content="authenticity_token"/>
<meta name="csrf-token" content="CROTodz0FR1ZJpl+Lp4xL0fh6Dx8ydu6Ge5OBSV23g4="/>
</head>
<body>
  <div id="container">
    <div id="flash_notice" style="display:none"></div

<div id="customer_form">


<form accept-charset="UTF-8" action="/customers" class="new_customer" data-remote="true" id="new_customer" method="post"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /><input name="authenticity_token" type="hidden" value="CROTodz0FR1ZJpl+Lp4xL0fh6Dx8ydu6Ge5OBSV23g4=" /></div>

  <div id="customer_errors" style="display:none"></div>

  <div class="field">

    <label for="customer_firstname">Firstname</label>
    <input id="customer_firstname" name="customer[firstname]" size="30" type="text" />
    <label for="customer_Lastname">Lastname</label>
    <input id="customer_lastname" name="customer[lastname]" size="30" type="text" />
  </div>
  <div class="field">
    <label for="customer_email">Email</label>

    <input id="customer_email" name="customer[email]" size="30" type="text" />
    <label for="customer_phone">Phone</label>
    <input id="customer_phone" name="customer[phone]" size="30" type="text" />
  </div>
  <div class="field">
    <label for="customer_password">Password</label>
    <input id="customer_password" name="customer[password]" size="30" type="text" />
    <label for="customer_address_id">Address</label>

    <input id="customer_address_id" name="customer[address_id]" size="30" type="text" />
  </div>
  <div class="actions">
    <input id="customer_submit" name="commit" type="submit" value="Create Customer" />
  </div>
</form></div>
<div id="customers_list">
<table>
  <tr>
    <th>Firstname</th>

    <th>Lastname</th>
    <th>Email</th>
    <th>Phone</th>
    <th>Password</th>
    <th>Address</th>
    <th></th>

    <th></th>
    <th></th>
  </tr>

  <tr>
    <td>Jonathan </td>
    <td>McCarthy</td>
    <td>jonathan.mccarthy@ncirl.ie</td>

    <td>083 4342009</td>
    <td>letmeinsoon</td>
    <td>1</td>
    <td><a href="/customers/1/edit" data-remote="true">Edit</a></td>
    <td><a href="/customers/1" data-confirm="Are you sure?" data-method="delete" data-remote="true" rel="nofollow">Destroy</a></td>
  </tr>

  <tr>
    <td>Joseph</td>
    <td>McGouran</td>
    <td>joe_mcgouran@yahoo.ie</td>
    <td>086 2210662</td>
    <td>accesssought</td>

    <td>1</td>
    <td><a href="/customers/3/edit" data-remote="true">Edit</a></td>
    <td><a href="/customers/3" data-confirm="Are you sure?" data-method="delete" data-remote="true" rel="nofollow">Destroy</a></td>
  </tr>
  <tr>
    <td>Marie</td>
    <td>McGouran</td>

    <td>mariemcgouran@yahoo.co.uk</td>
    <td>2988858</td>
    <td>dontmesswithme</td>
    <td>1</td>
    <td><a href="/customers/4/edit" data-remote="true">Edit</a></td>
    <td><a href="/customers/4" data-confirm="Are you sure?" data-method="delete" data-remote="true" rel="nofollow">Destroy</a></td>

  </tr>
  <tr>
    <td>Stephen </td>
    <td>McGouran</td>
    <td>stephenmcgouran@gmail.com</td>
    <td>2988858</td>
    <td>whogoesthere</td>

    <td>1</td>
    <td><a href="/customers/7/edit" data-remote="true">Edit</a></td>
    <td><a href="/customers/7" data-confirm="Are you sure?" data-method="delete" data-remote="true" rel="nofollow">Destroy</a></td>
  </tr>
  <tr>
    <td>Cathy </td>
    <td>McGouran</td>

    <td>cathymcgouran@gmail.com</td>
    <td>2988858</td>
    <td>openthedoor</td>
    <td>1</td>
    <td><a href="/customers/8/edit" data-remote="true">Edit</a></td>
    <td><a href="/customers/8" data-confirm="Are you sure?" data-method="delete" data-remote="true" rel="nofollow">Destroy</a></td>

  </tr>
  <tr>
    <td>Peter </td>
    <td>McGouran</td>
    <td>petermcgouran@gmail.com</td>
    <td>74931548</td>
    <td>open sesame</td>

    <td>1</td>
    <td><a href="/customers/9/edit" data-remote="true">Edit</a></td>
    <td><a href="/customers/9" data-confirm="Are you sure?" data-method="delete" data-remote="true" rel="nofollow">Destroy</a></td>
  </tr>
  <tr>
    <td>Gary</td>
    <td>McGouran</td>

    <td>garymcgouran@gmail.com</td>
    <td>5566779824</td>
    <td>pilotgogo</td>
    <td>1</td>
    <td><a href="/customers/11/edit" data-remote="true">Edit</a></td>
    <td><a href="/customers/11" data-confirm="Are you sure?" data-method="delete" data-remote="true" rel="nofollow">Destroy</a></td>

  </tr>
  <tr>
    <td>Matthew</td>
    <td>Busby</td>
    <td>mattbusby@gmail.com</td>
    <td>76588888</td>
    <td>babesteam</td>

    <td>1</td>
    <td><a href="/customers/15/edit" data-remote="true">Edit</a></td>
    <td><a href="/customers/15" data-confirm="Are you sure?" data-method="delete" data-remote="true" rel="nofollow">Destroy</a></td>
  </tr>
  <tr>
    <td>John </td>
    <td>Beales</td>

    <td>johnbeales@yahoo.com</td>
    <td>9988664433</td>
    <td>russiantripper</td>
    <td>1</td>
    <td><a href="/customers/20/edit" data-remote="true">Edit</a></td>
    <td><a href="/customers/20" data-confirm="Are you sure?" data-method="delete" data-remote="true" rel="nofollow">Destroy</a></td>

  </tr>
  <tr>
    <td>Brian</td>
    <td>Wade</td>
    <td>bbwade@gmail.com</td>
    <td>9999998888</td>
    <td>wadeoff</td>

    <td>1</td>
    <td><a href="/customers/30/edit" data-remote="true">Edit</a></td>
    <td><a href="/customers/30" data-confirm="Are you sure?" data-method="delete" data-remote="true" rel="nofollow">Destroy</a></td>
  </tr>
  <tr>
    <td>Yasser</td>
    <td>Arafat</td>

    <td>yasser@Gmail.com</td>
    <td>9999999-999</td>
    <td>speaksoftly my friend</td>
    <td>1</td>
    <td><a href="/customers/31/edit" data-remote="true">Edit</a></td>
    <td><a href="/customers/31" data-confirm="Are you sure?" data-method="delete" data-remote="true" rel="nofollow">Destroy</a></td>

  </tr>
  <tr>
    <td>MIchael </td>
    <td>Sweeney</td>
    <td>mick@ntma.com</td>
    <td>456278</td>
    <td>mickn</td>

    <td>2</td>
    <td><a href="/customers/35/edit" data-remote="true">Edit</a></td>
    <td><a href="/customers/35" data-confirm="Are you sure?" data-method="delete" data-remote="true" rel="nofollow">Destroy</a></td>
  </tr>
  <tr>
    <td>MIchael</td>
    <td>Semple</td>

    <td>mibksemp@gmail.com</td>
    <td>0044897345</td>
    <td>micko</td>
    <td>1</td>
    <td><a href="/customers/36/edit" data-remote="true">Edit</a></td>
    <td><a href="/customers/36" data-confirm="Are you sure?" data-method="delete" data-remote="true" rel="nofollow">Destroy</a></td>

  </tr>
  <tr>
    <td>Harry</td>
    <td>Potter</td>
    <td>harrypot@gmail.com</td>
    <td>086332123</td>
    <td>wizard</td>

    <td>1</td>
    <td><a href="/customers/39/edit" data-remote="true">Edit</a></td>
    <td><a href="/customers/39" data-confirm="Are you sure?" data-method="delete" data-remote="true" rel="nofollow">Destroy</a></td>
  </tr>
</table>


</div>



  </div>
</body>
</html

从服务器发送的错误消息的JS如下所示。customer_errors div未发生任何变化：

   /* Hide the Flash Notice div */
   /* Update the html of the div customer_errors with the new one */
   /* Show the div customer_errors */

   $("#flash_notice").hide(300);
   $("#customer_errors").html(
                            <li>Phone can\'t be blank</li>

                            <li>Password can\'t be blank</li>

                            <li>Address can\'t be blank</li>
                            );
   $("#customer_errors").show(300);

从服务器发送的用于编辑操作的JS如下所示。基本上，我似乎无法在firebug中发现Div更新字符串中是否存在某种错误：

$("#customer_form").html("\n<form accept-charset=\"UTF-8\" action=\"/customers/4\" class=\"edit_customer\" data-remote=\"true\" id=\"edit_customer_4\" method=\"post\"><div style=\"margin:0;padding:0;display:inline\"><input name=\"utf8\" type=\"hidden\" value=\"&#x2713;\" /><input name=\"_method\" type=\"hidden\" value=\"put\" /><input name=\"authenticity_token\" type=\"hidden\" value=\"mOAikAY8A22vPmNYzLWWm64lPU22imzIA/jOcXQVhAw=\" /><\/div>\n\n  <div id=\"customer_errors\" style=\"display:none\"><\/div>\n\n  <div class=\"field\">\n    <label for=\"customer_firstname\">Firstname<\/label>\n    <input id=\"customer_firstname\" name=\"customer[firstname]\" size=\"30\" type=\"text\" value=\"Marie\" />\n    <label for=\"customer_Lastname\">Lastname<\/label>\n    <input id=\"customer_lastname\" name=\"customer[lastname]\" size=\"30\" type=\"text\" value=\"McGouran\" />\n  <\/div>\n  <div class=\"field\">\n    <label for=\"customer_email\">Email<\/label>\n    <input id=\"customer_email\" name=\"customer[email]\" size=\"30\" type=\"text\" value=\"mariemcgouran@yahoo.co.uk\" />\n    <label for=\"customer_phone\">Phone<\/label>\n    <input id=\"customer_phone\" name=\"customer[phone]\" size=\"30\" type=\"text\" value=\"2988858\" />\n  <\/div>\n  <div class=\"field\">\n    <label for=\"customer_password\">Password<\/label>\n    <input id=\"customer_password\" name=\"customer[password]\" size=\"30\" type=\"text\" value=\"dontmesswithme\" />\n    <label for=\"customer_address_id\">Address<\/label>\n    <input id=\"customer_address_id\" name=\"customer[address_id]\" size=\"30\" type=\"text\" value=\"1\" />\n  <\/div>\n  <div class=\"actions\">\n    <input id=\"customer_submit\" name=\"commit\" type=\"submit\" value=\"Update Customer\" />\n  <\/div>\n<\/form>");

这是新记录成功后生成的JS。它的工作原理是：

   /* Hide the div customer_errors */
   /* Update the html of the div flash_notice with the new one */
   /* Clear the form */
   /* Replace the html of the div customers_list with the updated one */

   $("#customer_errors").hide(300);  
   $("#flash_notice").html("Customer Record Created.");   
   $("#flash_notice").show(300);   
   $(":input:not(input[type=submit])").val("");  
   $("#customers_list").html("\n<table>\n  <tr>\n    <th>Firstname<\/th>\n    <th>Lastname<\/th>\n    <th>Email<\/th>\n    <th>Phone<\/th>\n    <th>Password<\/th>\n    <th>Address<\/th>\n    <th><\/th>\n    <th><\/th>\n    <th><\/th>\n  <\/tr>\n\n  <tr>\n    <td>Jonathan <\/td>\n    <td>McCarthy<\/td>\n    <td>jonathan.mccarthy@ncirl.ie<\/td>\n    <td>083 4342009<\/td>\n    <td>letmeinsoon<\/td>\n    <td>1<\/td>\n    <td><a href=\"/customers/1/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/1\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n  <tr>\n    <td>Joseph<\/td>\n    <td>McGouran<\/td>\n    <td>joe_mcgouran@yahoo.ie<\/td>\n    <td>086 2210662<\/td>\n    <td>accesssought<\/td>\n    <td>1<\/td>\n    <td><a href=\"/customers/3/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/3\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n  <tr>\n    <td>Marie<\/td>\n    <td>McGouran<\/td>\n    <td>mariemcgouran@yahoo.co.uk<\/td>\n    <td>2988858<\/td>\n    <td>dontmesswithme<\/td>\n    <td>1<\/td>\n    <td><a href=\"/customers/4/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/4\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n  <tr>\n    <td>Stephen <\/td>\n    <td>McGouran<\/td>\n    <td>stephenmcgouran@gmail.com<\/td>\n    <td>2988858<\/td>\n    <td>whogoesthere<\/td>\n    <td>1<\/td>\n    <td><a href=\"/customers/7/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/7\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n  <tr>\n    <td>Cathy <\/td>\n    <td>McGouran<\/td>\n    <td>cathymcgouran@gmail.com<\/td>\n    <td>2988858<\/td>\n    <td>openthedoor<\/td>\n    <td>1<\/td>\n    <td><a href=\"/customers/8/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/8\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n  <tr>\n    <td>Peter <\/td>\n    <td>McGouran<\/td>\n    <td>petermcgouran@gmail.com<\/td>\n    <td>74931548<\/td>\n    <td>open sesame<\/td>\n    <td>1<\/td>\n    <td><a href=\"/customers/9/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/9\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n  <tr>\n    <td>Gary<\/td>\n    <td>McGouran<\/td>\n    <td>garymcgouran@gmail.com<\/td>\n    <td>5566779824<\/td>\n    <td>pilotgogo<\/td>\n    <td>1<\/td>\n    <td><a href=\"/customers/11/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/11\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n  <tr>\n    <td>John <\/td>\n    <td>Beales<\/td>\n    <td>johnbeales@yahoo.com<\/td>\n    <td>9988664433<\/td>\n    <td>russiantripper<\/td>\n    <td>1<\/td>\n    <td><a href=\"/customers/20/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/20\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n  <tr>\n    <td>MIchael <\/td>\n    <td>Sweeney<\/td>\n    <td>mick@ntma.com<\/td>\n    <td>456278<\/td>\n    <td>mickn<\/td>\n    <td>2<\/td>\n    <td><a href=\"/customers/35/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/35\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n  <tr>\n    <td>bbbbbb<\/td>\n    <td>ddddddddd<\/td>\n    <td>gggggggg<\/td>\n    <td>9999999999<\/td>\n    <td>enterin<\/td>\n    <td>1<\/td>\n    <td><a href=\"/customers/48/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/48\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n<\/table>\n\n\n");

以下是成功删除后生成的JS。这类似于成功创建记录后的操作

/* hide customer_errors div */
/* show flash notice */
/* send script to update customers_list div with new customers list */

$("#customer_errors").hide(300);
$("#flash_notice").html("Customer Record Deleted");
$("#flash_notice").show(300);
$("#customers_list").html("\n<table>\n  <tr>\n    <th>Firstname<\/th>\n    <th>Lastname<\/th>\n    <th>Email<\/th>\n    <th>Phone<\/th>\n    <th>Password<\/th>\n    <th>Address<\/th>\n    <th><\/th>\n    <th><\/th>\n    <th><\/th>\n  <\/tr>\n\n  <tr>\n    <td>Jonathan <\/td>\n    <td>McCarthy<\/td>\n    <td>jonathan.mccarthy@ncirl.ie<\/td>\n    <td>083 4342009<\/td>\n    <td>letmeinsoon<\/td>\n    <td>1<\/td>\n    <td><a href=\"/customers/1/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/1\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n  <tr>\n    <td>Joseph<\/td>\n    <td>McGouran<\/td>\n    <td>joe_mcgouran@yahoo.ie<\/td>\n    <td>086 2210662<\/td>\n    <td>accesssought<\/td>\n    <td>1<\/td>\n    <td><a href=\"/customers/3/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/3\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n  <tr>\n    <td>Marie<\/td>\n    <td>McGouran<\/td>\n    <td>mariemcgouran@yahoo.co.uk<\/td>\n    <td>2988858<\/td>\n    <td>dontmesswithme<\/td>\n    <td>1<\/td>\n    <td><a href=\"/customers/4/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/4\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n  <tr>\n    <td>Stephen <\/td>\n    <td>McGouran<\/td>\n    <td>stephenmcgouran@gmail.com<\/td>\n    <td>2988858<\/td>\n    <td>whogoesthere<\/td>\n    <td>1<\/td>\n    <td><a href=\"/customers/7/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/7\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n  <tr>\n    <td>Cathy <\/td>\n    <td>McGouran<\/td>\n    <td>cathymcgouran@gmail.com<\/td>\n    <td>2988858<\/td>\n    <td>openthedoor<\/td>\n    <td>1<\/td>\n    <td><a href=\"/customers/8/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/8\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n  <tr>\n    <td>Peter <\/td>\n    <td>McGouran<\/td>\n    <td>petermcgouran@gmail.com<\/td>\n    <td>74931548<\/td>\n    <td>open sesame<\/td>\n    <td>1<\/td>\n    <td><a href=\"/customers/9/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/9\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n  <tr>\n    <td>Gary<\/td>\n    <td>McGouran<\/td>\n    <td>garymcgouran@gmail.com<\/td>\n    <td>5566779824<\/td>\n    <td>pilotgogo<\/td>\n    <td>1<\/td>\n    <td><a href=\"/customers/11/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/11\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n  <tr>\n    <td>John <\/td>\n    <td>Beales<\/td>\n    <td>johnbeales@yahoo.com<\/td>\n    <td>9988664433<\/td>\n    <td>russiantripper<\/td>\n    <td>1<\/td>\n    <td><a href=\"/customers/20/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/20\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n  <tr>\n    <td>MIchael <\/td>\n    <td>Sweeney<\/td>\n    <td>mick@ntma.com<\/td>\n    <td>456278<\/td>\n    <td>mickn<\/td>\n    <td>2<\/td>\n    <td><a href=\"/customers/35/edit\" data-remote=\"true\">Edit<\/a><\/td>\n    <td><a href=\"/customers/35\" data-confirm=\"Are you sure?\" data-method=\"delete\" data-remote=\"true\" rel=\"nofollow\">Destroy<\/a><\/td>\n  <\/tr>\n<\/table>\n\n\n");

从上面可以清楚地看出，customers\u list div始终是更新的，没有任何问题，而customer\u表单和customer\u错误则完全没有问题

今天晚些时候我有空的时候会看看这个。我给您的提示是查看jQuery的attr方法，并更改表单上的action属性，使其指向正确的创建、更新、，第二个问题的提示是，你需要在HTML中的某个地方有一个errors div来显示Rails中的错误，然后通过javascript返回这些错误，并在页面上以红色框显示给用户。我在布局表单中有一个errors div和flash div。我想知道在控制器中，如果模型约束检测到错误，则执行js.erb文件。我同意更改_formpartial中的action属性。我不知道如何在JS.erb文件中进行销毁和更新。谢谢你的帮助，马上就到了。我学到了很多——还有很长的路要走。iwasRobbed.correction-errors div的格式为_formpartial。抱歉，我被抢了。我现在有另一个问题，请参见上面的编辑帖子。这部分昨天工作正常。更新-正在为错误消息和编辑响应生成JavaScript。但是，顶部customer_表单部分的DOM div没有被服务器生成和发送的HTML替换？我被抢了