使用Cocoon和Jquery更新fields_for中的字段

我想使用Jquery使用Cocoon gem在fields_for中设置field的值。 我在jquery上使用change事件。

_形成

 

i %>

_item_fields

 
p.unit_cost}]}, { include_blank: true }, { class: "product-select"} %>

咖啡脚本

 $("#items").on "cocoon:after-insert", -> $(".product-select").change -> $(".cost-input").val($(".product-select :selected").data("unit_cost")) 

问题是,它只适用于第一个嵌套记录。 这可能与fields_for生成的动态id有关,但我不知道如何处理它。

任何帮助,将不胜感激。


已经对脚本进行了更改,这是我的问题的答案。

 $("#items").on "change", ".product-select", -> product_select = $(this) product_select.parent().find('.cost-input').val(product_select.find(':selected').data('unit_cost')) 

感谢nathanvda帮助我。

您使用元素ID。 它在HTML页面中被认为是唯一的。 你应该使用类来代替。

[更新]好的。 您使用全局选择器,因此您可以更改具有该类的所有元素。

我猜你真正想要的是改变刚刚插入的元素。 如文档中所示,这是可能的。 写吧

 $("#items").on "cocoon:after-insert", (e, added_item) -> added_item.find(".product-select").change -> $(this).parent().find(".cost-input").val($(this).selected.data("unit_cost")) 

此代码未经过测试,但我所做的是:附加change事件。 在更改事件中,使用$(this) ,它指向触发事件的容器,并将其用作查找所需项的相对点。

请注意,如果您只使用jquery,这将更容易解决。

 $('#items").on "change", ".product-select", -> product_select = $(this) product_select.parent().find('.cost_input').val(product_select.selected().data("unit_cost")) 

这将捕获在#items .product-select元素上发生的#items内的所有change事件。 这是动态的,因此它也适用于新添加的项目。 您可能需要稍微调整jquery,以找到所选值。 正如我所说:未经测试的代码,但我希望你得到漂移。