在初始化后向Select2添加选项

Question

这似乎是一个标准的需求，但我很难找到一个清晰简单的解决方案。

我想要能够向已初始化的 Select2 添加一个或多个额外选项。

我正在使用较旧版本的 Select2，目前不确定版本号是什么。

- Stewart Alan

Answer 1

您可以通过与标准的<select>相同的方式解决大多数涉及Select2的问题。 在这种情况下，相应的<select>问题是：使用JavaScript向选择添加选项。

var option = new Option("text", "id");
$("select").append(option);

如果你希望在插入时它被选中，你只需在新选项上设置 selected 属性即可。

var option = new Option("text", "id");
option.selected = true;

$("select").append(option);
$("select").trigger("change");

请注意，我也触发了 change 事件，以便 Select2 知道所选选项已更改。

- Kevin Brown-Silva

---

Kevin，我在Select2上提出了一个问题。看起来你在这方面有很好的经验，可以解决这个问题。我尝试了多次，但它不起作用。如果可能的话，你能否请看一下这个链接：http://stackoverflow.com/questions/35729864/jquery-select2-selected-value-from-database-by-ajax - Roxx

谢谢，这正是我所需要的！ - Szabi Zsoldos

Answer 2

哎呀，我应该在发布之前先思考一下。

只需在底层的选择器中添加一个新选项即可：

$("#myselect").append($('<option>', {value: 1, text: 'new option'}));

甚至不需要重新初始化 select2。

- Stewart Alan

Answer 3

我使用select2的“Data”属性解决了这个问题。首先，我用json获取数据，然后按照以下方式使用我的数组创建了select2元素。

corrCodeArray是我的json数组。

function fillSelectReportPeriod() {
var corrCodeArray = retrieveCorrCodes();
$(".js-example-basic-multiple").select2({
    maximumSelectionLength: 4,
    data: corrCodeArray
});    

}

注意：当我使用类名$(".js-example-basic-multiple")时，选择元素的名称为$("#selectReportPeriod")，它不起作用，因此我使用了类名。

- Engin Aydogdu

Answer 4

这对我有效：

$("#company_dealer").val('Newly Selected Dealer').trigger('change');

- Sinan Eldem

---

这并没有回答问题。 - Fabian Horlacher