bootstrap select下拉框模糊搜索和动态绑定数据解决方法
此方法适合后台一次性返回所有数据好了废话不多说直接上代码;
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap-select test page</title> <meta charset="utf-8">
//代码自己下载
<link rel="stylesheet" href="http://www.jq22.com/jquery/bootstrap-3.3.4.css">
<link rel="stylesheet" href="dist/css/bootstrap-select.css/"> <style>
body {
padding-top: 70px;
}
</style> <script src="http://www.jq22.com/jquery/1.11.1/jquery.min.js"></script>
<script src="http://www.jq22.com/jquery/bootstrap-3.3.4.js"></script>
<script src="dist/js/bootstrap-select.js"></script>
</head>
<body>
<form class="form-horizontal" role="form">
<div class="form-group">
<label for="basic" class="col-lg-2 control-label">"Basic" (liveSearch enabled)</label>
<div class="col-lg-4">
<select id="basic" class="selectpicker show-tick form-control" data-live-search="true">
<option>cow</option>
<option data-subtext="option subtext">bull</option>
<option data-subtext="option subtext">bull</option>
<option data-subtext="option subtext">bull</option>
<option data-subtext="option subtext">bull差</option>
<option data-subtext="option subtext">bull2</option>
<option data-subtext="option subtext">bull</option>
<option data-subtext="option subtext">bull</option>
<option data-subtext="option subtext">bull</option>
<option data-subtext="option subtext">bull</option>
</select>
</div>
</div>
</form>
$(".selectpicker" ).selectpicker('refresh'); //动态绑定数据一定要加这句话否则没用看下图;

效果如图

</body>
bootstrap select下拉框模糊搜索和动态绑定数据解决方法的更多相关文章
- HTML中的select下拉框内容显示不全的解决办法
HTML中的select下拉框内容显示不全的解决办法 今天,我遇到这样一个问题:查询栏中的下拉框中的内容过长,导致部分被覆盖了. 查询了一些资料,有的说用函数控制,有的说用事件控制,有的看不懂,有的实 ...
- easyUI combobox下拉框很长,easyUI combobox下拉框如何显示滚动条的解决方法
如下图,combobox下拉框里内容很多时,会导致下拉框很长,很不美观. 如何使得combobox下拉框显示滚动条 方法:把属性panelHeight:"auto"注释掉即可. $ ...
- ionic中select下拉框点击无反应解决办法
两种解决办法: 1.在select外的div加入属性 data-tap-disabled=”true” 2.找到ionic.bundle.js文件 的下面这个函数,添加如图两行代码
- 项目总结12:bootstrap-select下拉框模糊搜索
bootstrap select下拉框模糊搜索 关键字 bootstrap-select 下拉框模糊搜索 正文(直接上源码) <%@ page language="java" ...
- Bootstrap Flat UI的select下拉框显示不出来 问题解决
Bootstrap Flat UI的select下拉框显示不出来?看这里,恰巧今天我也遇到了这个问题: 点击Messages后并没有出现下拉列表,然而官网的index.html却能显示出来. 经过一番 ...
- firefox浏览器中 bootstrap 静态弹出框中select下拉框不能弹出(解决方案)
问题出现场景1: 在firefox浏览器中在bootstrap弹出的modal静态框中再次弹出一个静态框时 select下拉框不能弹出选项 解决方案:去掉最外层静态框的 tabindex=" ...
- select下拉框之默认选项清空
最近和小伙伴发现,select默认选项一般是提示信息,怎么才能让当我们点击下拉框时,可选的选项中没有默认的提示信息呢? 思路: 1.当点击下拉框时,让默认提示信息,即下拉框第一个选项移除. 2.当没有 ...
- 基于Bootstrap的下拉框插件bootstrap-select
写在前面: 在这次的项目中,没有再使用liger-ui做为前端框架了,改为了Bootstrap,这次也好接触下新的技术,在学习的过程中发现,Bootstrap的一些组件基本都是采用class的形式,就 ...
- s:select下拉框validation验证
S:select下拉框验证: <td colspan="5"> <s:select name="vo.typeVO.corp" list=&q ...
随机推荐
- Simplify Path(路径简化)
问题: 来源:https://leetcode.com/problems/simplify-path Given an absolute path for a file (Unix-style), s ...
- JAVA基础面向对象分析
面向对象内存的分析: 一:内存的分类 1:栈(tack) 2:堆(heop) 3: 静态区 4:代码区 二:引用数据类型内存特点 三:引用数据类型传值的特点 四:引用数据类型在作为参数时的特点 面向对 ...
- Linux yum 命令篇
yum( Yellow dog Updater, Modified)是一个在Fedora和RedHat以及SUSE中的Shell前端软件包管理器. 基於RPM包管理,能够从指定的服务器自动下载RPM包 ...
- BZOJ 4033: [HAOI2015]树上染色题解
BZOJ 4033: [HAOI2015]树上染色题解(树形dp) 标签:题解 阅读体验:https://zybuluo.com/Junlier/note/1327400 原题地址: BZOJ 403 ...
- ☆☆☆☆☆Placeholder兼容各大浏览器的例子☆☆☆☆☆
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- Paper Reading_Computer Architecture
最近(以及预感接下来的一年)会读很多很多的paper......不如开个帖子记录一下读paper心得 Computer Architecture Last level cache (llc) perf ...
- json与导入模块目录
import json """主要用于不同语言的数据公用 """ info = {"a":1,"b" ...
- Redis数据类型及基本命令
一.基础命令 提示:Redis不区分命令大小写 1.获得符合规则的键名列表 keys pattern //pattern支持glob风格通配符格式 2.判断一个键是否存在 exists key ...
- luogu P1232 [NOI2013]树的计数
传送门 这题妙蛙 首先考虑构造出一个合法的树.先重新编号,把bfs序整成\(1,2,3...n\),然后bfs序就是按照从上到下从左往右的遍历顺序,所以可以考虑对bfs序分层,可以知道分层方式只会对应 ...
- Codeforces Round #569 (Div. 2) 题解A - Alex and a Rhombus+B - Nick and Array+C - Valeriy and Dequ+D - Tolik and His Uncle
A. Alex and a Rhombus time limit per test1 second memory limit per test256 megabytes inputstandard i ...