Select2 v4 .val() 不维护数据对象中元素的顺序

Question

我有一个 select2 (v4) select 框，人们在其中选择代码，必须保持顺序。当他们最初添加元素时，这很有效：

但是，这是一个用于页面上许多不同元素的弹出窗口。这意味着我必须清除这个数组并动态加载存储的数据对象。

我的数据对象将顺序保留为 var codeArray = ['7990', '268']。

但是当我使用时：

$(element).val(codeArray).trigger("change")

我得到以下信息：

如何维护加载顺序？有偷偷摸摸的解决方法吗？

Answer 1

好吧，这个修复程序很老套，但我会 post 我所拥有的：

function rebuildForm(codeArray) {
  clearFormContents();
  $.each(codeArray, function(j,obj){
    var found = false;
      code_list.some(function(el){
        if (el.value == obj) {
            var str = (el.text).split(")");
            $("element option[value=" + el.value + "]").remove();
            $(element).append(new Option("(" + el.value + ")" + str[1] , obj));
            found = true;
        }
      })
      if (!found) {
        $(element).append(new Option("(" + obj + ") Custom Tag" , obj));
      }
    $(element).val(codeArray).trigger("change");
}

抱歉，如果上面的代码不能完美运行，我不得不清理它以去除一些绒毛并隐藏 client/project 身份。

基本上，在重建表单时，我清除了旧表单内容，然后循环遍历数组以获取每个 value/object。然后，如果该值存在于 select2 元素的原始代码选项列表中，我删除该选项并重建它。这会将它附加到元素列表的底部，以便在框中保持顺序。我还使用 'found' 布尔值添加任何自由格式的文本标签。

在 "correct" 顺序中创建新的选项列表后，我就可以将值添加回 select 输入 DOM 元素并触发 select2 更改以构建标签。

这个由@RohitS 在评论中 post 编辑的帖子展示了这个概念：https://github.com/select2/select2/issues/3106

我只是根据需要对其进行了调整。

Select2 v4 .val() 不维护数据对象中元素的顺序

Select2 v4 .val() does not maintain order of elements in data object

javascript

jquery

jquery-select2-4

select2