2015/10/25 using bootstrap Selectpicker to implement drop-down lists with fuzzy queries

Today's time is more relaxed, just tidy up their use of this two days a small plug-in function, do not involve too wide, just for their own better understanding.

Implementation features: Drop-down list shows people list, support input keywords for fuzzy query (People list through database query)
1. Java code: Controller
@RequestMapping (value = "List.do", method = Requestmethod.get)
Public Modelandview Listuser () {
Modelandview Mav = new Modelandview ("url");
Here is just an interface call, the implementation of the background through Hibernate query database, return to the employee list, Employeequerybean is a query condition bean
list<employee> queryemployeebyqueryparams = employeeservice.queryemployeebyqueryparams (New EmployeeQueryBean ());
Mav.addobject ("result", queryemployeebyqueryparams);
return MAV;
}

2. JSP
Introduced plugins: <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" >
The Col-xs-2:bootstrap grid system divides the page into 12 columns, where the number is used to specify the width
<label class = "Col-xs-2 control-lable" > People list:</label>
<div class = "Col-xs-5" >
Selectpicker: This is the use of a bootstrap drop-down plugin
Data-live-search: Set to find input box
<select name = "User" class = "Form-control selectpicker show-tick" Data-live-search = "true" >
Jstl here uses a Foreach loop to dynamically read the data returned by the database and then dynamically add options
<c:foreach items = "${result}" var = "Co" >
<option value = "${co.id}" >${co.name}</option>
</c:forEach>
</div>
</div>

3. js file
$ (function () {
Start Bootsrap-select
$ (". Selectpicker"). Selectpicker ({
Dropuauto:false
});
})

2015/10/25 using bootstrap Selectpicker to implement drop-down lists with fuzzy queries