想使用Select2组件必须引用:select2.min.css和select2.min.js两个文件:如下:

页面写法很简单:

在这里多选是没有搜索功能的,只有单选的时候才会有搜索功能。

Select2的数据源最起码得有Id和text两个字段

下面就是Select2的数据处理了:

这里的item的数据为:

效果如下:

当Select2与模态框一起使用的时候,把模态框的tabindex="-1"属性去掉,不然select2会出问题。

BootStrap Select2组件的更多相关文章

  1. JS组件系列——Bootstrap Select2组件使用小结

    前言:在介绍select组件的时候,博主之前分享过一篇JS组件系列——两种bootstrap multiselect组件大比拼,这两个组件的功能确实很强大,只可惜没有图文结合的效果(也就是将图片放入到 ...

  2. 转载 JS组件Bootstrap Select2使用方法详解

    JS组件Bootstrap Select2使用方法详解 作者:懒得安分 字体:[增加 减小] 类型:转载 时间:2016-01-26我要评论 这篇文章主要为大家介绍了JS组件Bootstrap Sel ...

  3. JS组件系列——两种bootstrap multiselect组件大比拼

    前言:今天继续来看看bootstrap的另一个组件:multiselect.记得在项目开始之前,博主项目组几个同事就使用哪些js组件展开过讨论,其中就说到了select组件,由于项目的整体风格使用的b ...

  4. 详解Bootstrap缩略图组件及警示框组件

    缩略图组件 缩略图在网站中最常用的就是产品列表页面,一行显示几张图片,有的在图片底下带有标题.描述内容.按钮等信息.bootstrap框架将这部分独立成一个模块组件,通过类名.thumbnail配合b ...

  5. BootStrap常用组件及响应式开发

    BootStrap常用组件 PS:所有的代码必须写在<class="container/container-fluid">容器当中 常用组件包含内容: 字体图标 下拉菜 ...

  6. 【转载】BootStrap表格组件bootstrap table详解

    (转载,来源“脚本之家”,作者不详) 一.Bootstrap Table的引入 关于Bootstrap Table的引入,一般来说还是两种方法: 1.直接下载源码,添加到项目里面来.由于Bootstr ...

  7. Sweetalert模态对话框与Swiper轮播插件、Bootstrap样式组件、AdminLTE后台管理模板地址

    Sweetalert纯JS模态对话框插件地址:http://mishengqiang.com/sweetalert/ AdminLTE后台管理模板系统地址(基于Bootstrap):https://a ...

  8. Bootstrap Blazor 组件库 Row 布局组件(栅格系统)

    原文链接:https://www.cnblogs.com/ysmc/p/16133351.html 在 Bootstrap 中,栅格相信大家都很熟悉,简直就是布局神器啊,Bootstrap Blazo ...

  9. JS组件系列——分享自己封装的Bootstrap树形组件:jqTree

    前言:之前的一篇介绍了下如何封装自己的组件,这篇再次来体验下自己封装组件的乐趣.看过博主博客的园友应该记得之前分享过一篇树形菜单的使用JS组件系列——Bootstrap 树控件使用经验分享,这篇里面第 ...

随机推荐

  1. 遍历数据库全部表,将是datetime类型的列的值进行更新

    declare @tablename nvarchar(80)   declare @cloumn nvarchar(80)   declare @sql nvarchar(400) declare ...

  2. Thinkpad升级Window10无法安装expresscache

    本人有一台Thinkpad T440s,自从看了这篇帖子12秒开机!ExpressCache SSD缓存加速,就给自己的小黑加持了一块固态硬盘.使用后效果确实很明显. 问题 自从系统自动升级到wind ...

  3. conda安装速度慢解决办法

    注意,清华已经撤掉其ananconda源, 下面的方法已经失效,中科大源好像也不行,如果有解决办法烦请评论告诉我. conda config --add channels https://mirror ...

  4. 多媒体开发之---h.264 rtsp网络流测试流

    rtsp://218.204.223.237:554/live/1/66251FC11353191F/e7ooqwcfbqjoo80j.sdp 珠海拱北

  5. github远程仓储和本地仓储进行关联

    我们使用github作为远程仓储,需要提前注册号一个github账号 由于github仓储和本地仓储之间传输是使用ssh加密的,所以需要一点设置, 1.创建sshkey  gitbash执行: ssh ...

  6. make eval builtin function

    1 eval的返回值是空字符串,因此它可以用于Makefile的任何位置而不引起错误 2 eval函数的作用效果 生成Makefile的动态部分,即eval用于增加Makefile的构成部分. 也就是 ...

  7. 网络驱动移植之简述CS8900A网络芯片的基本原理

    CS8900A数据手册:http://www.cirrus.com/cn/products/cs8900a.html 1.概述 CS8900A是CIRRUS LOGIC公司生产的低功耗.性能优越的16 ...

  8. Serializable 接口与 Java 序列化与反序列化

    0. 序列化的意义 从内存到本地即为本地化或者在网络中进行传输,或叫序列化,持久化. 某 Java 类实现 Serializable 接口的目的是为了可持久化(简单理解为本地化),比如网络传输或本地存 ...

  9. 并不对劲的bzoj4816:loj2000:p3704[SDOI2017]数字表格

    题目大意 有函数\(f(x)\),\(f(0)=0,f(1)=1,f(x)=f(x-1)+f(x-2)\) \(t\)(\(t\leq1000\))组询问,每次给定\(n,m\)(\(n,m\leq1 ...

  10. 并不对劲的图论专题(三):SPFA算法的优化

    1.bzoj1489-> 这是个新套路. 我们希望找到最小的x,那么可以二分x,然后判断是否存在圈的边权的平均值小于等于x. 设圈的边权依次为w1,w2,w3,…,wk,平均值为p, 则有p= ...