删除多个选择选项并替换为新选项答案

【问题标题】：Removing multiple select options and replace with new ones删除多个选择选项并替换为新选项
【发布时间】：2020-03-15 15:19:43
【问题描述】：

我有一个选择标签，例如：

<span id="reportProjectSelector">
    <span>Reporting Project:</span>
    <select id="reportProjectDropdown" onChange="loadChartWithData();" multiple="multiple"></select>
</span>

和

$(function() {
    $('#reportProjectDropdown_${widgetId}').multiselect({
        includeSelectAllOption: true
    });
});

在这里，我有多个其他下拉列表的下拉链，它们是“reportProjectDropdown”的父级。为简单起见，让我们只考虑一个“项目”。所以现在我们有了“项目”，在更改时会触发“报告项目”过滤器。目前，报告项目过滤器不会更改和替换新值（基本上为 null 或没有值，这些值被下拉列表中的“无报告项目”之类的值替换）

我已尝试删除以前的值，但没有运气。这是我期望的功能。

function setDependentProjects (data, widgetId) {
    $('#reportProjectDropdown').find('option').remove().end();

    if(jQuery.isEmptyObject(data)) {
        let newOption = new Option("No Projects", 0, true, true);
        $('#reportProjectDropdown').append(newOption);
    } else {
        let selected = true;
        for(let key in data) {
            selected = "${defaultDependentProject}" == data[key];
            let newOption = new Option(data[key], key, selected, selected);
            $('#reportProjectDropdown').append(newOption);
            selected = false;
        }
    }

    loadChartWithData_${widgetId}(); //renders data as per the previous filters
}

我是否遗漏了某些内容或错误地删除了元素？

【问题讨论】：

从哪里调用 setDependentProjects？你能设置stackblitz吗？

标签： javascript jquery multi-select

【解决方案1】：

您需要在每次更改后刷新 jQuery 多选实例。你可以使用$('#reportProjectDropdown').multiSelect('refresh');

另请参阅文档：jQuery multiselect

【讨论】：

我收到“未捕获的类型错误：$(...).multiSelect 不是函数”，不知道为什么。我已经在使用多选功能。我有默认的内置容器，它具有引导程序和多选库
@Einstein_AB 看来您当时没有使用loudev.com 多选库。你用的是什么框架？ multiselect 不是原生的 jQuery 函数。
@Niklas.E.它不是 HTML
@Einstein_AB 但是您在问题中使用了$(...).multiselect(...)。 jQuery 的这个方法不是 jQuery 自己添加的。它是由 jQuery 的扩展/插件添加的。是什么插件？你用的是什么 jQuery 插件？它不是来自loudev.com 的插件，否则您不会收到错误消息。
jQuery.multiselect.js 是库。