Question

我有一个使用turbo链接和jquery.turbolinks的rails 4应用程序。它还使用jQuery日期选择器插件。

我正在使用Ryan Bates的技术在一个表单中添加/编辑多个模型，来自Railscast第196集“嵌套模型表单”。

就我而言，我正在添加/编辑与家庭相关的人员。 person_fields部分包含一个'尝试'使用日期选择器的生日字段（一个字符串输入与class =“datepicker”），但它不起作用，当我点击一个类的字段时，不会出现datepicker '.datepicker'。

使用页面加载的其他表单，datepicker工作正常。但是对于使用此代码动态添加的此表单，日期选择器不会出现。

以下是插入部分链接的代码：

  def link_to_add_fields(name, f, association)
    new_object = f.object.send(association).klass.new
    id = new_object.object_id
    fields = f.fields_for(association, new_object, child_index: id) do |builder|
      render(association.to_s.singularize + "_fields", f: builder)
    end
  link_to(name, '#', class: "add_fields small round button success", data: {id: id, fields: fields.gsub("\n", "")})
 end

用于插入部分的咖啡脚本：

$('form').on 'click', '.add_fields', (event) ->
  time = new Date().getTime()
  regexp = new RegExp($(this).data('id'), 'g')
  $(this).before($(this).data('fields').replace(regexp, time))
  event.preventDefault()

日期选择器的咖啡脚本：

$('.datepicker').datepicker()

非常感谢任何帮助。

---更新---

感谢Billy Monk的建议，添加字段的代码现在看起来像这样：

$('form').on 'click', '.add_fields', (event) ->
  time = new Date().getTime()
  regexp = new RegExp($(this).data('id'), 'g')
  $(this).before($(this).data('fields').replace(regexp, time))
  event.preventDefault()
  $('.datepicker').datepicker()

它有效！非常感激！一旦我被允许就会接受答案。

Answer 1

在添加新字段的JavaScript函数中添加$（'。datepicker'）。datepicker（）。日期选择器不会自动绑定到新添加的元素。

部分插入后jQuery datepicker未初始化

1 个答案: