选择2 追加和删除选项组和选项

Question

我正在尝试创建一个动态 select2 下拉列表，其中包含选项组和选项。选项组中需要包含动态数量的选项。

我遇到的问题是如何删除选项组及其所有选项，使用相同的标签和 id 重新附加相同的选项组，但现在在 jquery 中使用不同的选项。

这是我在每次更改时调用的函数，当选项组的选项应该更改时：

function EmptyDropDowns() {
$("[id$=ddlOfficeAccount] optgroup").remove();
$("[id$=ddlOfficeAccount]").append('<optgroup id="Offices" label="Offices"></optgroup>');
$("[id$=Offices]").append($("<option></option>").text("- All Offices -").val("0"));
}

然后，用其他选项填充组选项：

if (Offices.length > 0) {
for (var i in result.Offices) {
$("[id$=Offices]").append($("<option></option>").text(result.Offices[i]).val(result.Offices[i]));
}
}

这仅在第一次有效，创建一个 Select2 下拉列表，其中包含一个选项组 办公室，并相应地在其中包含 X 个办公室。但是当需要重新加载时，以下代码：

$("[id$=ddlOfficeAccount] optgroup").remove();
$("[id$=ddlOfficeAccount]").append('<optgroup id="Offices" label="Offices"></optgroup>');

重新附加相同的选项组，即使它在 DOM 中不再实际存在。

无论如何，在重新附加之前可以清除 $("[id$=Offices]"( 吗？我需要它是相同的元素(相同的 id(，因为我稍后将组选项作为所选选项的父选项。

Answer 1

您必须显式销毁 select2 元素，然后重新注册它。 $('#mySelect2'(.select2('destroy'(;