javascript - link_to_add 和 link_to_remove - 动态单击它们

Question

我正在使用 gem https://github.com/ryanb/nested_form我有一个模型，其中有 accepts_nested_attributes_for 。虽然它工作得很好，但有时我希望能够在页面上添加/删除(主要是添加)表单，该表单始终通过按钮添加/删除:

.row
  #tasks
    = f.fields_for :tasks do |task_form|
      ..............

      = task_form.link_to_remove "Remove", class: "btn btn-danger"
      = f.link_to_add  "Add task", :tasks, class: "btn btn-default", data: { target: "#tasks" }

也就是说，我想点击link_to_add和link_to_remove动态地(不是通过鼠标)，可能是通过调用应该存在于 nested_form 中的方法 gem 。当然，我可以通过 javascript 通过触发按钮的点击事件来实现这一点，但我的直觉告诉我必须有一种更简单、更自然的方法来做到这一点。有吗？

更新:

当然，我对 JavaScript 没问题。我不太同意按钮的触发点击事件，因为nested_form中必须有一种更简单和标准的方法。 .

Answer 1

我不太确定你想在这里完成什么。一方面，您说您想要动态地执行此操作，但同时，您不想使用 JavaScript。我听起来很矛盾。

无论如何，如果你在你的new方法中这样做:

def new
  @to_do = ToDo.new
  @to_do.tasks.build
end

然后，在您的表单中，页面加载时将显示一组任务字段，而无需单击添加按钮。

我不知道这是你要找的东西，还是其他东西。

PS:我不认为 JavaScript 有什么不自然的地方。您使用的这个 gem 完全依赖于 JavaScript。

更新

现在您已经更新了您的问题。我建议阅读 gem 的源代码并找出哪个函数绑定(bind)到按钮单击事件。然后，您可以将相同的函数绑定(bind)到您喜欢的任何事件。

话虽如此，让我们看一下这个文件:

https://github.com/ryanb/nested_form/blob/master/vendor/assets/javascripts/jquery_nested_form.js

查看最后几行。添加按钮点击事件绑定(bind)到nestedFormEvents.addFields函数。继续将您的事件绑定(bind)到此函数，您将不必触发按钮单击。