rails3 jquery datepicker 不适用于动态添加的表单字段答案

【问题标题】：rails3 jquery datepicker doesn't work on dynamically added form fieldsrails3 jquery datepicker 不适用于动态添加的表单字段
【发布时间】：2012-10-08 10:44:04
【问题描述】：

当我们的事件编辑页面加载时，有两个日期字段使用 jquery 日期选择器，当我单击其中一个字段时，选择器也会出现。

在加载文档时初始化日期选择器。

$ ->
  $(':input.date').datepicker(dateFormat: 'dd.mm.yy')

并且自动添加“datepicker”类

<input class="span1 date hasDatepicker" id="event_application_opening_at" name="event[application_opening_at]" size="30" type="text">

因为可以将其他日期添加到事件中，所以当用户单击“添加日期”链接时，我们会创建额外的嵌套日期字段。

虽然“hasDatepicker”类已正确分配给这些字段，但日期选择器不适用于这些新创建的字段。看起来这是因为日期选择器已经初始化了。我尝试应用 destroy() 函数，然后在整个页面内容上重新初始化 datepicker，但这不起作用。

有谁能帮我解决这个问题吗？

【问题讨论】：

标签： jquery ruby-on-rails datepicker

【解决方案1】：

试试这个

 $(":input.date").live("click", function(){
        $(this).datepicker({ 
            dateFormat: 'dd.mm.yy' 
        });
    });

更新：

$(":input.date").live("click", function(){
            $(this).datepicker({ 
                dateFormat: 'dd.mm.yy' 
            });
          $(this).datepicker('show');

        });

【讨论】：

这可行，但我必须单击该字段，离开它，然后再次单击它，直到出现日期选择器
我现在在 Datepicker 处于活动状态的日期字段旁边添加了小时和分钟的选择字段。当我单击这些选择框之一时，日期选择器也会出现在关闭选择下拉列表的日期字段上。为什么会这样？选择的项目没有分配“日期”类

【解决方案2】：

hynxnat 答案的替代方法是绑定到您用于添加字段的任何代码的“after:insert”事件。如果您将日期选择器代码添加到该事件，它将确保在动态插入字段后绑定到页面上的字段。

这将假设您正在使用 Cocoon gem 之类的东西来添加额外的字段。

【讨论】：