通过以下代码从后台动态加载数据
//绑定bootstrap-select事件
$orgid.on('shown.bs.select',function(e){
//为input绑定事件
$orgid.prev().find("input").keyup(function(){
//为input增加id属性,见下方截图
$orgid.prev().find("input").attr('id',"orgname");
var orgname = $('#orgname').val().trim();
var data = {
'name':orgname
}
initOrglist($orgid,data);
})
});
位置
封装方法
function initOrglist($obj,data){
$.ajax({
type: "post",
url:'',
data:data,
async:false,
dataType: "json",
success: function(res){
if (null != res) {
var html = '';
Object.keys(res).forEach(function(key){
html += '<option value="' + res[key].id + '" data-tokens="'+ res[key].text+'">' + res[key].text+ '</option>';
});
$obj.html(html);
//必须加,刷新select
$obj.selectpicker('refresh');
}
}
});
}
赋初始值
$('#roomid').selectpicker('val', rooms);
rooms为集合,格式[8,9,10]
参考:这里写链接内容
在一些级联选择的使用场景中,经常需要在赋值的时候顺便触发一下组件的change事件,我们可以这么做。
$('.selectpicker').selectpicker('val', '1').trigger("change");
如果是多选的赋值,也是一样
$('.selectpicker').selectpicker('val', ['1','2','3']).trigger("change");
参考:https://blog.csdn.net/m0_37355951/article/details/78287278