我有一个Bootstrap Selectpickers数组,用于过滤数据库中的结果。我需要一种将所有选择器重置为“无选择”的方法,这是我的代码:
<div class="row">
<div class="col-md-3">
<label>By Group</label>
<select id="groups" name="group" class="form-control selectpicker" multiple></select>
</div>
<div class="col-md-3">
etc...
</div>
</div>
ajax_fetch('build_group_options', {groupno:groupno}).done(function(html) {
//var html is a list of options in html format
$('#groups').html(html).find('option[value=""]').remove();
//refresh the selectpicker to make sure options are registered in the picker
$('.selectpicker').selectpicker('refresh');
});
尝试重置所有选择器:
$('#reset_filters').click(function() {
$('.selectpicker').selectpicker('deselectAll');
$('.selectpicker').selectpicker('render');
$('.selectpicker').selectpicker('refresh');
$(this).closest('form').find('.selectpicker').each(function() {
$(this).selectpicker('render');
});
});
如您所见,我已经尝试过重置所有功能,但都无济于事,因此很明显在逻辑上做错了一些。
因此,我查看了selectpicker.js文件,deselectAll
和selectAll
函数都通过一些参数过滤了各自的选项(请参见第884行):
deselectAll: function () {
this.findLis();
this.$lis.not('.divider').not('.disabled').filter('.selected').filter(':visible').find('a').click();
}
一点故障:
.not('.divider') //prevents the divider receiving a click event!
.not('.disabled') //ignore any disabled elements
.filter('.selected') / .not('.selected') //depending if its selectAll() or deselectAll()
.filter(':visible') //prevent any non-visible element receiving a click event!?
我的问题是.filter(':visible')
,在触发click事件时,该列表不可见,因此这些选项被过滤掉了,因此没有被“单击” /“取消选择”。我修改了插件的版本,现在我的“重置”按钮可以正常工作了。新行是:
this.$lis.not('.divider').not('.disabled').filter('.selected').find('a').click();
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句