一尘不染

将新表单添加到DOM时,client_side_validations(3.1.0)不起作用

ajax

我正在使用Rails 3.1.0rc4和client_side_validations
3.1.0。只要在主请求中呈现表单,一切都可以完美地工作。但是,如果表单本身是通过javascript添加到页面的,则提交表单会导致服务器端验证。我怀疑问题在于,当通过javascript将表单添加到页面时,我需要以某种方式“绑定”客户端验证功能。

例如,假设我有一个简单的表单,您可以在其中发布新的工作清单:

#jobs/new.html.erb
<%= form_for [@job], :validate => true  do |f| %>

  <%= render :partial => 'common/form_errors', :locals => {:record => @job} %>

  <div class="field">
      <%= f.label :title %>
      <%= f.text_field :title %>
  </div>
  <div class="field">
    <%= f.label :description %>
    <%= f.text_field :description %>
  </div>

  <div class="actions">
    <%= f.submit %>
  </div>
<% end %>

以及我模型中的以下验证:

class Job < ActiveRecord::Base
  validates_presence_of :title, :description
end

如果我通过在浏览器中访问new_job_path来访问此表单,则我的客户端验证非常有用。

但是,如果我将此表单插入另一个页面(例如,jobs_path索引页面),则如下所示:

#jobs/index.html.erb
<%= render @jobs %>

<div id="form-job-new"> </div>

<%= link_to 'New Job', new_job_path, :remote =>true %>

和:

#jobs/new.js.erb
$('#form-job-new').append("<%= escape_javascript render(:file => 'jobs/new.html.erb') %>");

然后在提交表单时,验证将应用于服务器端。

知道我缺少什么吗?


阅读 199

收藏
2020-07-26

共1个答案

一尘不染

在此gem的javascript源代码中找到了答案:

// Main hook
// If new forms are dynamically introduced into the DOM the .validate() method
// must be invoked on that form
$(function() { $('form[data-validate]').validate(); })

因此,在我的特定情况下,我需要这样做:

#jobs/new.js.erb
$('#form-job-new').append("<%= escape_javascript render(:file => 'jobs/new.html.erb') %>");
$('form[data-validate]').validate();
2020-07-26