如何向JQuery UI Multiselect添加或删除选项?我在页面加载时初始化多选框,需要根据另一个选择删除现有值并添加新值。我使用以下方式在页面加载时初始化多选框:
$("#multipleselectboxId").multiselect();
之后,我使用jQuery的append()
和remove()
方法向多个下拉列表添加值。在原始下拉列表中,这些方法正常工作,但在多选框中未能反映出来。请问有人可以帮忙吗?如何向JQuery UI Multiselect添加或删除选项?我在页面加载时初始化多选框,需要根据另一个选择删除现有值并添加新值。我使用以下方式在页面加载时初始化多选框:
$("#multipleselectboxId").multiselect();
之后,我使用jQuery的append()
和remove()
方法向多个下拉列表添加值。在原始下拉列表中,这些方法正常工作,但在多选框中未能反映出来。请问有人可以帮忙吗?对于这个问题,您可以在更改后销毁并重新初始化...
$("#multipleselectboxId").append(toAppend).multiselect("destroy").multiselect();
还有另一个带有刷新功能的插件:EricHynds's Multiselect
$("#multipleselectboxId").append(toAppend).multiselect("refresh");
$("#multipleselectboxId").append(toAppend);
$("#multipleselectboxId").remove(toRemove);
$("#multipleselectboxId").multiselect('destroy');
$("#multipleselectboxId").multiselect();
This worked for me:
```$('#multiselect_id').html(newHtml);
$('#multiselect_id').multiselect('refresh');
我曾尝试通过使用.multiselect("destroy")
和.multiselect()
来重建多选框,但是它没有起作用,最终我找到了这个解决方案。
$.each(jsonArray, function(i, val) {
$('#frmarticles-f_category_id').append('<option value="'+i+'">'+val+'</option>').multiselect('rebuild');
});
以下是我的操作步骤:可能比必要的要多,但对我有效。
需要修改的原始“select”代码:
<select id="MySelect" name="selection">
<option value="1">One</option>
<option value="2">Two</option>
</select>
我使用PHP重建选项列表,通过JSON将其发送到JavaScript,并在变量中构建/存储新列表。例如:
// this is similar to if we got it from PHP
var newList = '<option value="A">Alpha</option>
<option value="B">Beta</option>
<option value="C">Gamma</option>';
$('#MySelect').html(''); // clear out old list
$('#MySelect').multiselect('destroy'); // tell widget to clear itself
$('#MySelect').html(newList); // add in the new list
$('#MySelect').multiselect(); // re-initialize the widget
特别地,我使用参数重新初始化了它,例如:
$('#MySelect').multiselect({selectedList: 4, header: false});
jQuery("select[title='" + FieldNameTitleText + "']").append( "<option value='" + OptionValue+ "'>" + OptionText + "</option>" ).multiselect("refresh");
这个插件很好用,但是我在销毁和过滤方面遇到了问题:我的组合数据是通过ajax加载的。因此,当我使用ajax调用刷新数据时,我会调用destroy来刷新插件:
myCombo.multiselect('destroy');
myCombo.multiselect().multiselectfilter();
它可以在第一次调用时工作:空的组合框,ajax调用以加载数据,调用上面的函数。 但是如果我刷新组合框数据并再次调用上述函数,过滤器会消失? 有人之前遇到过这个问题并找到了解决方案吗?
var i = jQuery('input');
i.data('multipleSelect').$parent.remove();
i.removeData('multipleSelect');
i.show();
我也遇到了同样的问题,但最终我解决了。请使用$(selecter).multiselect("refresh");
而不是$(selecter).multiselect("reload")
;
var valArr = ["1", "2"],
i = 0,
size = valArr.length,
$options = $('#MySelect option');
for (i; i < size; i++) {
$options.filter('[value="' + valArr[i] + '"]').prop('selected', true);
}
$('#MySelect').multiselect('reload');
1. valArr 是 select 选项的值
2. 使用 for 循环根据 valArr 设置匹配选项的 selected 属性
3. 我们的更改仅在隐藏的 select 元素中进行
4. 要更改多选生成的元素,我们需要重新加载
5. 每个插件可能有不同的名称来重新加载,例如:update、refresh。
Uncaught TypeError: $(...).multiselect is not a function.
. 不知道为什么我需要使用大写字母,这样才能正常工作,例如$("#multipleselectboxId").multiSelect();
. 我正在使用默认的 jQuery UI 多选框。 - Mira Nedved