bootstrap-select 下拉菜单

  最近在写前端页面，遇到一个实现多选的下拉菜单，所以我选择了bootstrap-select这个控件，首先得引入css和js

	href="#springUrl('/static/bootstrap-select/css/bootstrap-select.min.css')" />

   下面这段代码实现了从后端拿到数据，然后填充到下拉菜单里面。

$(function() {  	
    $(".selectpicker").selectpicker({  
        noneSelectedText : '请选择'//默认显示内容  
    }); 
  
	//初始化刷新数据  
    $(window).on('load', function() {  
        $('.selectpicker').selectpicker('val', '');  
        $('.selectpicker').selectpicker('refresh');  
    }); 
	var selectDeptId = $("#deptId").val();
  //下拉数据加载  
     $.ajax({  
        type : 'get',  
        url : "#springUrl('/proj/getParticipatingDeptList')?leadingDeptId="+selectDeptId,  
        dataType : 'json',  
        success : function(datas) {//返回list数据并循环获取 
            var select = $("#deptId1");  
            for (var i = 0; i < datas.length; i++) {  
                select.append(""  
                        + datas[i].deptName + "");  
            }  
            $('.selectpicker').selectpicker('val', '');  
            $('.selectpicker').selectpicker('refresh');  
        }  
    });   


});  

但是在编辑功能的时候，需要先将之前选的数据加载在框中。

$(function() {  	
    $(".selectpicker").selectpicker({  
        noneSelectedText : '请选择'//默认显示内容  
    }); 
  
	//初始化刷新数据  
     var projDeptList = '$!{projDeptList}';
     if(projDeptList.length != 0){
    	 var json = JSON.parse(projDeptList);
       	 var array=new Array();
       	 //var json = eval('$!{allDeptList}'); 
       	for(var i = 0; i < json.length; i++){
       		var id = json[i].deptId;
       		array.push(id);
       	}
     }
	
	var selectDeptId = $("#deptId").val();
  //下拉数据加载  
     $.ajax({  
        type : 'get',  
        url : "#springUrl('/proj/getParticipatingDeptList')?leadingDeptId="+selectDeptId,  
        dataType : 'json', 
        success : function(datas) {//返回list数据并循环获取 
            var select = $("#deptId1");  
            for (var i = 0; i < datas.length; i++) { 
            	console.log(datas[i].deptId + datas[i].deptName);
                select.append(""  
                        + datas[i].deptName + "");  
            }  
            $('.selectpicker').selectpicker('val', array);  
            $('.selectpicker').selectpicker('refresh');  
        }  
    });   

}); 

以上代码从后端的modelandview里面拿到'$!{projDeptList}'，对其进行处理之后塞到array里面，只需用$('.selectpicker').selectpicker('val', array)即可实现数据加载。