将新表单添加到DOM时，client_side_validations（3.1.0）无法正常工作

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

例如，假设我有一个简单的表单，您可以在其中发布新的职位列表：

#jobs/new.html.erb  true do |f| %>  'common/form_errors', :locals => {:record => @job} %> 
   
 
   
 
  
  

以及我模型中的以下validation：

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

如果我通过访问浏览器中的new_job_path来访问此表单，我的客户端validation效果很好。

但是，如果我将此表单插入另一个页面（例如jobs_path索引页面），如下所示：

 #jobs/index.html.erb  
 
 true %> 

和：

 #jobs/new.js.erb $('#form-job-new').append(" 'jobs/new.html.erb') %>"); 

然后在提交表单时，validation将应用于服务器端。

知道我错过了什么吗？

Answer 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(); 

Answer 2

根据你使用ujs的程度（我做了很多），做这样的事情可能更有意义，而不是在每个ujs文件中调用validate方法。

 $('body').bind("ajax:success", function() { if($('form[data-validate]').length){ $('form[data-validate]').validate(); } }); 

或coffeescript

 $("body").bind "ajax:success", -> $("form[data-validate]").validate() if $("form[data-validate]").length