bootstrap select 用法
我们要做的功能是 点击下拉显示搜索框和数据，搜索框内输入关键字可以匹配数据内容，并可以多选
【bootstrap select 用法】实现效果如下
文章图片
文章图片
文章图片
首先引入jquery和bootstrap
html中的代码
js中的代码
$(function () {
$.ajax({
method: 'get',
dataType: "json",
url: "/api/teacher/queryGroupByTeacher",
success: function (data) {
//console.log(data.rows.groupid);
var groupid = data.rows.groupid
$.ajax({
method: 'get',
dataType: "json",
url: "/api/student/queryStudentByGroupAndStudent",
data: {
groupid: groupid,
name: ''
},
success: function (res) {
var str = '';
for (var i = 0;
i < res.rows.length;
i++) {
$('.selectpicker').append('');
}
$('.selectpicker').selectpicker();
// 缺一不可
$('.selectpicker').selectpicker('refresh');
$('.selectpicker').selectpicker('render');
}
})
}
})
推荐阅读
- Spring|Spring Boot之ImportSelector
- canvas（一）基本用法
- performSelectorOnMainThread:withObject:waitUntilDone:参数设置为NO或YES的区别
- 一般现在时
- 学习日记block众多用法中的一种用法
- vue的cli用法
- python之SimpleHTTPServer用法
- 不为人知的排序和筛选用法
- python|python UI自动化11- 常见定位元素用法（二）
- select|select bell