JQueryUI selectmenu - 删除所有选项

时间:2015-02-04 16:31:07

标签: jquery-ui jquery-ui-selectmenu

我从一个安静的网络服务中填充jquery-ui没有问题。

// get data from web-service
var subjectResponse = data.SiteSubjectResponse;

// The jquery-UI selectmenu
var $subjectOptions = $('#subjectOptions');

for(var i = 0; i < subjectResponse.length; i++)
{
    // Build the Option
    var $option = $('<option/>');
    var subjectName = subjectResponse[i].name;
    var subjectId = subjectResponse[i].id;
    $option.text(subjectName).val(subjectId);
    $subjectOptions.append($option);
}
// set the default item to the first item                                    
$('#subjectOptions').val(subjectResponse[0].clinicalTrialSubjectId);

// refresh jquery-ui selectmenu
$('#subjectOptions').selectmenu('refresh', true);

问题在于我想要删除此selectmenu中的所有先前项目,因此我知道使用标准jquery这已经过去了。

// clear all options first, if any are there, used to work
$('#subjectOptions').find('option').remove().end();

我看到这个解决方案也在StackOverflow上列出,但它似乎也无法正常工作。

$("#subjectOptions option").each(function(index, option) {
        $(option).remove();
 });
// refresh list after we have removed all options
$('#subjectOptions').selectmenu('refresh', true);

如果你尝试在selectmenu中没有选项进行刷新,那么你会收到一条错误消息,而且从我的谷歌搜索中,这似乎是selectmenu的一个错误,它不是最新稳定版本的一部分爱好。

所以,我正在寻找一个清晰,简单的解决方案来删除所有选项,并从jquery-ui选择菜单中删除所选项目。如果有人可以将我推荐给链接或文档,或提供一个例子,那就太棒了。 如果我还没有看过JQuery UI Selectmenu文档并搜索谷歌寻求解决方案,我就不会发布这个问题。

感谢您的帮助!

1 个答案:

答案 0 :(得分:7)

感谢您的帮助,但目前真正的答案是:

$('#myOptions').find('option').remove().end();
$('#myOptions').selectmenu('destroy').selectmenu({ style: 'dropdown' });

第一行确实找到了从select中删除选项的工作,但这并没有改变JQueryUI selectmenu生成的额外HTML。

最新版本的JQuery UI(1.11.2)还有一个非常讨厌的错误,我不知道什么时候会将其引入最新的稳定版本。错误是当selectmenu下拉选项中没有[li]选项时,'refresh'将失败。 http://bugs.jqueryui.com/ticket/10662

JQueryUI团队或报告错误的人也应该发布解决方案,以便人们不必担心下一个修复。解决方法正是我所拥有的:

$('#myOptions').selectmenu('destroy').selectmenu({ style: 'dropdown' });

这将破坏选择,并重新创建它,这解决了问题。

也许JQueryUI团队应该考虑:

$( '#myOptions')selectmenu( '清除');

从[li]中删除现有选项,然后为我们刷新selectmenu。那将是非常好的。

我希望这有助于其他人。