Question

我循环遍历一个对象，对于循环中的每个实例，我想提供一个多选下拉列表（使用jQuery插件SumoSelect）。但是，现在，SumoSelect似乎只绑定到循环中的第一个多选下拉列表，而不是之后的任何下拉列表。循环中的每个下拉列表如何具有SumoSelect效果？（在Github上有一个未解决的问题）

查看控制台，我看到第一个下拉列表已附加：div class="SumoSelect" tabindex="0">，但这不适用于其他示例。

我尝试了几个不同的选项并查看了源代码（并搜索了一堆），但我不清楚我需要采取哪些不同的做法。

这是一个简化的例子。让我们说我有一个课程＆＃34; post＆＃34;可以有很多作者和＃34;在我显示＆＃34;帖子＆＃34;的页面上，我想循环浏览帖子，并为每个帖子给用户一个多选下拉列表，从中选择作者添加到帖子中。现在，来自循环的第一篇文章的作者下拉列表具有正确的SumoSelect效果，但之后的任何帖子都没有SumoSelect：

posts / view.html.erb（此下拉列表为帖子和作者创建了一个连接表条目 - 执行此操作的控制器代码工作正常，问题只是在循环中的第一个下拉列表后绑定SumoSelect）：

<% @posts.each do |post| %>
....
<select id="author-choice" name="author_ids[]"  multiple="true">
  <% Author.all.each do |author| %>
     <option value="<%= author.id%>",<%= author.name %></option>
  <% end %>
</select> ...

在我的javascript中，我有：

$(document).ready(function (){ 
  $('#author-choice').SumoSelect();
});

Answer 1

您的问题是每个下拉列表都具有相同的ID，并且ID应该是唯一的。更改您的select元素，以便author-choice是一个类（class='author-choice'）并将jQuery选择器更改为$('.author-choice')。如果仍然没有解决问题，那么它现在是SumoSelect的错误，并且你必须使用迭代器包装应用SumoSelect的行：

$('.author-choice').each(function() {
    $(this).SumoSelect();
});

jQuery MultiSelect插件SumoSelect不绑定到单页

1 个答案: