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

2023-12-10

我正在使用 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 %>

and:

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

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

知道我缺少什么吗?


在这个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();
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

将新表单添加到 DOM 时,client_side_validations (3.1.0) 不起作用 的相关文章

随机推荐