bootstrap table简洁扁平的表格
使用方法
1、在html页面的head标签中引入Bootstrap库(假如你的项目还没使用)和bootstrap-table.css。
- <link rel="stylesheet" href="bootstrap.min.css">
- <link rel="stylesheet" href="bootstrap-table.css">
2、在head标签或者在body标签闭合前(比较推荐)引入jQuery库和Bootstrap库(假如你的项目还没使用)和bootstrap-table.js。
- <script src="jquery.min.js"></script>
- <script src="bootstrap.min.js"></script>
- <script src="bootstrap-table.js"></script>
3、指定数据源,这里有两种方式
1)通过data属性标签
在一个普通的表格中设置data-toggle="table"可以在不写JavaScript的情况下启用Bootstrap Table。
- <table data-toggle="table" data-url="data.json">
- <thead>
- ...
- </thead>
- </table>
2)通过JavaScript设置数据源
通过JavaScript来启用带有id属性的Table。
- $('#table').bootstrapTable({
- url: 'data.json'
- });
关于参数请参照官网的文档
bootstrap table简洁扁平的表格的更多相关文章
- 【转】bootstrap table轻松实现数据表格
在使用bootstrap table时可能在很多时候回用的表格来显示数据,如果自己写那肯定没问题,但是数据展示出来就麻烦多了,然而bootstrap table 封装了一套完善的数据表格组件,把从后台 ...
- BootStrap table动态增删改表格内数据
1:添加一个[操作]列 { title: "操作", align: 'center', valign: 'middle', width: 160, // 定义列的宽度,单位为像 ...
- Bootstrap Table 从新InsertRow 刷新表格 数据的问题处理方案
1.第一步获取数据源 var rows = { //要插入的数据,这里要和table列名一致SkuCode: data.rows[i].SkuCode,BarCode: data.rows[i].Ba ...
- bootstrap table使用colResizable后表格不能自适应
窗口缩小放大后,b表格不能自适应,table加了宽度没效果,求教
- JS组件系列——表格组件神器:bootstrap table
前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉及,罪过,罪过.今天补起来吧.上午博主由零开始自己从头到尾使用了一遍Bootstrap Table ,遇到不少 ...
- 表格组件神器:bootstrap table详细使用指南
1.bootstrap-table简介 1.1.bootstrap table简介及特征: Bootstrap table是国人开发的一款基于 Bootstrap 的 jQuery 表格插件,通过简单 ...
- [转]JS组件系列——表格组件神器:bootstrap table
原文地址:https://www.cnblogs.com/landeanfen/p/4976838.html 前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉 ...
- JS组件系列——表格组件神器:bootstrap table 包含了js对象的定义和对象成员函数的定义
前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉及,罪过,罪过.今天补起来吧.上午博主由零开始自己从头到尾使用了一遍Bootstrap Table ,遇到不少 ...
- JS组件系列——表格组件神器:bootstrap table(二:父子表和行列调序)
前言:上篇 JS组件系列——表格组件神器:bootstrap table 简单介绍了下Bootstrap Table的基础用法,没想到讨论还挺热烈的.有园友在评论中提到了父子表的用法,今天就结合Boo ...
随机推荐
- 第11章 Windows线程池(2)_Win2008及以上的新线程池
11.2 Win2008以上的新线程池 (1)传统线程池的优缺点: ①传统Windows线程池调用简单,使用方便(有时只需调用一个API即可) ②这种简单也带来负面问题,如接口过于简单,无法更多去控制 ...
- MongoDB学习(二)Windows环境安装MongoDB
MongoDB的官方下载站是http://www.mongodb.org/downloads,可以去上面下载最新的程序下来. 在下载页面可以看到,对操作系统支持很全面,OS X.Linux.Windo ...
- [ORACLE错误]ORA-00001: unique constraint (...) violated并不一定是数据冲突
遇到这种情况,重建完表和索引后,终于正常INSERT了. prompt Importing table COUPON_ACTIVITYset feedback offset define offin ...
- java 21 - 10 文本文件和集合之间互相存储数据
有时候,我们会遇到单独写入数据到文本文件的情况.比如: 需求:把ArrayList集合中的字符串数据存储到文本文件 分析: A:ArrayList集合中存储的是String类 B:要存储的文件是文本文 ...
- 层叠上下文(The stacking context)
MDNThe stacking context 层叠上下文是HTML元素的三维概念,这些HTML元素在一条假想的相对于面向(电脑屏幕的)视窗或者网页的用户的z轴上延伸,HTML元素依据其自身属性按照优 ...
- sp_executesql介绍和使用
原文:http://www.cnblogs.com/wanyuan8/archive/2011/11/09/2243483.html execute相信大家都用的用熟了,简写为exec,除了用来执行存 ...
- MVC3中,在control里面三种Html代码输出形式
MVC3中,在control里面三种Html代码输出形式:ViewData["msg"] = "<br /> Title <br />" ...
- WPF好看的进度条实现浅谈(效果有点类似VS2012安装界面)
为了界面友好,一般的操作时间较长时,都需要增加进度条提示.由于WPF自带的进度条其实不怎么好看,而且没啥视觉效果.后来,装VS2012时,发现安装过程中进度条效果不错,于是上网查了资料.学习了Mode ...
- js window.open()实现打印,如何在关闭打印窗口时刷新父窗口
var childWin = window.open("your URL"); //获取子窗口句柄childWin.onunload = function(){ //onunloa ...
- HMAC-MD5算法原理及实现
以下是分析节选,对于更详细的描述可以查阅RFC2104文档. HMAC需要一个加密用散列函数(表示为H)和一个密钥K. 假设H是一个将数据块用一个基本的迭代压缩函数来加密的散列函数. 用B来表 ...