Question

在视图中，我遍历一个集合并为每个集合填写各种信息。对于此集合中的每个值，都有一个下拉菜单，我希望根据选择填写特定的div。

<% @model.samples.each do |sample| %>
  <div class="top">
    <%=fields_for 'asample[]', sample, do |a_form| %>
      Dropdown: <%=a_form.select..........{id: "ex#{sample.id}"} %>
  </div>
  <div id="hold_partial>
      <%= render partial: "/folder/dropdown_based_partial" %>

我理解如何定期执行此操作，我不知道如何为样本中的每个可能样本获取唯一的侦听器。一个建议是一个抽象的js课程，但我并不完全有信心这是如何工作的。有什么建议？如果不清楚，我可以进一步阐述。

Answer 1

我认为您遇到的第一个问题是您将div多个id="hold_partial"。（顺便说一句，"结尾处您遗失"hold_partial。

现在，您可以执行以下操作：

<% @model.samples.each do |sample| %>
  <div class="top">
    <%=fields_for 'asample[]', sample, do |a_form| %>
      Dropdown: <%=a_form.select..........{id: "ex#{sample.id}", 'data-sample-id': sample.id} %>
  </div>
  <div id="hold-partial-#{sample.id}">
      <%= render partial: "/folder/dropdown_based_partial" %>

这样，您的option拥有data-sample-id，并且div具有唯一id个，您可以根据options.data(sampleId)定位{。}}。

然后，您可以将.on 'change'事件定位为：

$('select').on('change', function (e) {
  var targetPartial = $("#hold-partial-" + e.currentTarget.data('sampleId'));
  // do some fantastic stuff with your targeted partial
})

有几件事：

我倾向于在您的选择中添加一个类，以便您从所需的选择中捕获事件（如果您在页面上有一堆您想要不同的行为）。
e.currentTarget会为您提供生成change事件的元素。从那里，.data('sampleId')将为您提供在循环中分配的id。

HTH。

具有未知ID

1 个答案: