ajax - 如何在表单提交时显示验证错误

Question

我有一个简单的表单，只有输入字段名称，电子邮件。在我的视图页面上，我有可以输入客户电子邮件并以 ajax 方式保存的表单。这是我的视图页面：

_form.html.erb

   <%= form_for @customer, :remote=>true do |f| %>
       <div id="errors"></div>
        <%= f.text_field :email, :maxlength => 30, :placeholder => "Email", :id => "ecustomer" %>
        <%= f.submit "Save", :class => "btn btn-primary btn-large" %>
   <% end %>

这是我的 create.js.erb

  <% if @customer.errors.any? -%>
    $('<%= escape_javascript(render :partial => "error", :locals => {:target => @customer })%>').appendTo('#errors')
  <% else -%>
    $("<%= escape_javascript(render @customer) %>").prependTo("table.table.customers tbody");
  <% end -%>

我已经在电子邮件中验证了存在性和唯一性。为了显示验证错误，我有部分 _error.erb：

 <div class="alert alert-error">
  <h5><%= pluralize(@customer.errors.count, "error") %> prohibited this user from being saved:</h5>

  <ul>
  <% @customer.errors.full_messages.each do |msg| %>
    <li><%= msg %></li>
  <% end %>
  </ul>
</div>

但是我的验证错误仍然不可见。我不明白这里出了什么问题。任何人都可以帮助我如何让它工作吗？

谢谢你。

Answer 1

尝试在 JS 视图中添加 Try-Catch 块：

<% if @customer.errors.any? -%>
  try {
    $('<%= j(render :partial => "error", :locals => {:target => @customer })%>').appendTo('#errors');
  } catch( e ) {
    console.log( e );
  }
<% else -%>
  try {
    $("<%= j(render @customer) %>").prependTo("table.table.customers tbody");
  } catch( e ) {
    console.log( e );
  }
<% end -%>

如果该块没有记录，您可能正在处理语法错误。