Question

我正在开发一个包含多个多选项的表单。我使用Select2库。

 $(".chosen-select").select2({
            allow_single_deselect: true,
            width: "150px"
        });
......
<select id="ship2" class="chosen-select" data-placeholder="Select vessel">
<option></option>
<option value="value1">title1</option>
<option value="value2">title2</option>
</select>

问题在于，当我尝试获取选定值时，它们按照<select>元素中指定的顺序返回，而不是它们被选中的顺序：

var selectedDayPorts = $('#ship2');
var dayPorts = selectedDayPorts.select2("val");

有没有办法让它们按正确顺序排列？

Answer 1

有时这可能是一种帮助。在尝试了几种方法之后，我想出了一个解决方法，使用我在用户shashilo上使用此链接获得的代码。 https://github.com/select2/select2/issues/3106

但我不得不做一些安排，因为它没有100％完成我的案子。这是我的代码。

＆＃13;

$(".select2").on("select2:select", function (evt) {
          var element = evt.params.data.element;
          var $element = $(element);

          if ($(this).find(":selected").length > 1) {
            var $second = $(this).find(":selected").eq(-1);
            $second.after($element);
          } else {
            $element.detach();
            $(this).prepend($element);
          }

          $(this).trigger("change");
        });

＆＃13;

在他提到的链接中

＆＃13;

var $second = $(this).find(":selected").eq(-2);

＆＃13;

但对我有用的是

＆＃13;

var $second = $(this).find(":selected").eq(-1);

＆＃13;

在我的情况下，即使取消选择项目，这也很有效。

Answer 2

您可以使用：

var dayPorts = selectedDayPorts.select2("data");

获得价值观：

alert(dayPorts[0]['id']);

alert(dayPorts[0]['text']);

Answer 3

我没有找到如何让select2以正确的顺序存储值的方法，所以我最终为每个select2字段创建了隐藏的输入字段，并在添加/删除新值时相应地更新它

jQuery-select2 - 按选择的顺序获取值

3 个答案: