今天的时间比较宽松，就整理一下自己这两天使用到的一个小插件功能吧，不求涉及太广，只是为了自己更好的理解。
实现功能：下拉列表显示人员列表，支持输入关键字进行模糊查询（人员列表通过数据库查询得到）
1、java代码：Controller
@RequestMapping(value = "list.do", method = RequestMethod.GET)
public ModelAndView listUser(){
ModelAndView mav = new ModelAndView("url");
//这里只是一个接口的调用，后台的实现通过hibernate查询数据库，返回Employee列表， EmployeeQueryBean是一个查询条件Bean
List<Employee> queryEmployeeByQueryParams = employeeService.queryEmployeeByQueryParams(new EmployeeQueryBean());
mav.addObject("result",queryEmployeeByQueryParams );
return mav;
}
2、jsp
引入插件：<script type="text/javascript" src = "../bootstrap-select/js/defaults-zh_CN.js"/>
<script type="text/javascript" src = "../bootstrap-select/js/bootstrap-select.js"/>
<script type="text/javascript" src = "../bootstrap-select/css/bootstrap-select.css"/>
<div class = "form-group">
//col-xs-2：bootstrap 网格系统将页面分为12列，其中的数字用来指定宽度
<label class = "col-xs-2 control-lable">人员列表：</label>
<div class = "col-xs-5">
//selectpicker:这是使用了一个bootstrap下拉插件
//data-live-search：设置为查找输入框
<select name = "user" class = "form-control selectpicker show-tick" data-live-search = "true" >
//jstl这里使用forEach循环动态读取数据库返回的数据，然后动态添加选项
<c:forEach items = "${result}" var = "co">
<option value = "${co.id}">${co.name}</option>
</c:forEach>
</div>
</div>
3、js文件
$(function(){
//启动Bootsrap-Select
$(".selectpicker").selectpicker({
dropuAuto : false
});
})