bootstrap-select采坑

bootstrap-select采坑
1.class="selectpicker" 普通的下拉框功能
2.title="请选择城市名称" title的作用与palcehoder一样。
3.select class="selectpicker" multiple selectpicker和multiple属性的搭配使用可实现多选
4.data-live-search="true" 这个属性的默认值是false,作用是打开模糊筛查搜索框。
5.data-max-options 这个属性表示最多可选几个，搭配multiple使用，
用法：data-max-options=“2”，表示最多选两个。
6..data-selected-text-forma缩略模式，用法：data-selected-text-format="count > 3"，
当选中值大于3个的时候只显示选中项的个数，注意只对多选生效。
7.data-style 表示默认选中样式，
用法：data-style="btn-primary"，属性值就是bootstrap的按钮样式。
8..data-size data-size="6",表示下拉框显示的下拉列表数量。
9.data-dropup-auto=""

10.data-dropup-auto="false"，表示下拉框默认向下展开；"true"，表示下拉框默认向下展开；
"auto"，（默认值）表示下拉框根据页面尺寸自动向下或向上展开。
11$('.selectpicker').selectpicker('selectAll'); 全选：
$('.selectpicker').selectpicker('deselectAll'); 反选：
$('.selectpicker').selectpicker('mobile'); 适应手机模式：
12./给下拉框赋初始值 .selectpicker:eq(0)表示该页面或者该表单的第几个使用了第几个selectpicker属性的input标签
$('.selectpicker:eq(0)').selectpicker('val',valArea);
$('.selectpicker:eq(1)').selectpicker('val',valPost);
$('.selectpicker:eq(2)').selectpicker('val',valBank);
$('.selectpicker').selectpicker('refresh');
$('.selectpicker').selectpicker('render');
});

13.与angular或者knockout合用问题：
即下拉框无法显示出选项，但实际上，按下F12去查看时，又明显的有这些选项值，只是页面无法展示。
a. 添加Js：(只有在编译之后第一次进入页面的时候生效，一旦刷新之后就失效(因为angular异步加载)
$(function () {
$('.selectpicker').selectpicker('refresh');
$('.selectpicker').selectpicker('render');
})

bootstrap-select采坑相关推荐

【TP3.2】模板 select选项采坑
1.TP3.2 模板 select 下拉框采坑 <div class="form-item"><label class="item-label" ...
Centos7.9上利用cephadm安装Ceph Octopus 15.2的采坑记录，附带K8S挂载方法
Centos7.9上利用cephadm安装Ceph Octopus 15.2的采坑记录,附带K8S挂载方法 0.亮点 1 准备 1.1 修改历史记录 1.2 升级系统内核 1.3 配置免密登录问题1 ...
一. spring cloud gateway集成 spring cloud stream binder kafka，实现“动态路由“刷新与加载之采坑记录
一.前言 Spring Cloud Stream是用于构建消息驱动的微服务应用程序的框架. 本文主要介绍如何集成 Spring Cloud Stream,以 Kafka发布订阅模式(topic),实现 ...
定制化ROM采坑之路（1）:魔趣8.1版本源码下载和编译过程
前言记得当年刚接触Android的时候,就看有关老罗的文章倒是让我的安卓内功提升不少,但是由于工作都是停留在应用层的缘故,我几乎对这块并没有深入研究,最近公司的新产品对Framework层的开发有所 ...
oracle安装步骤缺少实例,oracle数据库安装步骤及采坑汇总
一.下载orcale 你如果已经有这两个安装包那就略过这一步! 官网:https://www.oracle.com/downloads/index.html 如访问需要登录oracle账号,则登录你的 ...
iOS 微信SDK1.8.6后需要UniversalLink解决方案及采坑记录
项目最初因审核原因,一直使用iOS原生分享, 最近因项目需求要求, 接入微信分享, 以为和原来的没有区别, 但是接入时才发现改动的地方还是挺多的, 主要是需要配置UniversalLink和提包时的一 ...
H5拍照、预览、压缩、上传采坑记录
H5拍照.预览.压缩.上传采坑记录公司项目前段时间需要实现手机拍照上传的功能,本来以为用createObjectURL和canvas可以很轻松的实现,结果发现问题多多,特此记录下来. DEMO预览( ...
MySQL单表数据量过千万，采坑优化记录，完美解决方案
MySQL单表数据量过千万,采坑优化记录,完美解决方案参考文章: (1)MySQL单表数据量过千万,采坑优化记录,完美解决方案 (2)https://www.cnblogs.com/ExMan/p/ ...
VS2015+MySql+EF6采坑经验总结
原文:VS2015+MySql+EF6采坑经验总结背景:VS2015+MySql+EF6(DB First) 采坑顺序:按照以前的记忆,操作依次如下: 1,安装 MySQL Connector/NE ...

bootstrap-select采坑

bootstrap-select采坑相关推荐

最新文章

热门文章