bootstrap-table
Version:
An extended table to integration with some of the most widely used CSS frameworks. (Supports Bootstrap, Semantic UI, Bulma, Material Design, Foundation)
249 lines (195 loc) • 22.2 kB
Markdown
# [Bootstrap Table](https://bootstrap-table.com)
[](https://travis-ci.org/wenzhixin/bootstrap-table)
[](http://badge.fury.io/gh/wenzhixin%2Fbootstrap-table)
[](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=ZDHP676FQDUT6)
[](#backers)
[](#sponsors)
[](https://packagequality.com/#?package=bootstrap-table)
An extended Bootstrap table with radio, checkbox, sort, pagination, extensions and other added features.
To get started, check out:
* [Docs](https://bootstrap-table.com)
* [Examples](https://github.com/wenzhixin/bootstrap-table-examples)
* [Questions/Helps](http://stackoverflow.com/questions/tagged/bootstrap-table)
* [问题/帮助](http://segmentfault.com/t/bootstrap-table)
[**List of donators**](https://github.com/wenzhixin/bootstrap-table/blob/master/DONATORS.md)
## LICENSE
**NOTE:** Bootstrap Table is licensed under [The MIT License](https://github.com/wenzhixin/bootstrap-table/blob/master/LICENSE). Completely free, you can arbitrarily use and modify this plugin. If this plugin is useful to you, you can **Star** this repo, your support is my biggest motive force, thanks.
## Features
* Created for Twitter Bootstrap (All versions supported)
* Responsive web design
* Scrollable Table with fixed headers
* Fully configurable
* Via data attributes
* Show/Hide columns
* Show/Hide headers
* Show/Hide footers
* Get data in JSON format using AJAX
* Simple column sorting with a click
* Format column
* Single or multiple row selection
* Powerful pagination
* Card view
* Detail view
* Localization
* Extensions
## How to get it
### Manual download
Use [Releases page](https://github.com/wenzhixin/bootstrap-table/releases) or [the source](https://github.com/wenzhixin/bootstrap-table/archive/master.zip).
### Yarn
```
yarn add bootstrap-table
```
### Npm
```
npm install bootstrap-table
```
### CDN
You can source bootstrap-table directly from a CDN like [CDNJS](http://www.cdnjs.com/libraries/bootstrap-table) or [bootcss](http://open.bootcss.com/bootstrap-table/) or [jsdelivr](http://www.jsdelivr.com/#!bootstrap.table).
## Contributing
For feature requests, bug reports or submitting pull requests, please ensure you first read [CONTRIBUTING.md](https://github.com/wenzhixin/bootstrap-table/blob/master/CONTRIBUTING.md).
## Reporting Issues
As stated above, please read [CONTRIBUTING.md](https://github.com/wenzhixin/bootstrap-table/blob/master/CONTRIBUTING.md), especially [Bug Reports](https://github.com/wenzhixin/bootstrap-table/blob/master/CONTRIBUTING.md#bug-reports)
And as stated there, please provide an [Online Example](https://live.bootstrap-table.com) when creating issues!
It's really saves much time.
You can also use our examples template via Load Examples button:
[Online Editor](https://live.bootstrap-table.com/)
Your feedback is very appreciated!
## Acknowledgements
Thanks to everyone who have given feedback and submitted pull requests. A list of all the contributors can be found [here](https://github.com/wenzhixin/bootstrap-table/graphs/contributors).
This project exists thanks to all the people who contribute. [[Contribute](CONTRIBUTING.md)].
<a href="graphs/contributors"><img src="https://opencollective.com/bootstrap-table/contributors.svg?width=890" /></a>
## Release History
Look at the [Change Log](https://github.com/wenzhixin/bootstrap-table/blob/master/CHANGELOG.md)
## Local develop
To develop bootstrap-table locally please run:
```bash
mkdir bootstrap-table-dev
cd bootstrap-table-dev
git clone https://github.com/wenzhixin/bootstrap-table
git clone https://github.com/wenzhixin/bootstrap-table-examples
yarn add http-server
npx http-server
```
And then open: http://localhost:8081/bootstrap-table-examples
## Local build
Be sure to use a current version of yarn/npm.
To build bootstrap-table locally please run:
### Yarn
```
yarn install
yarn build
```
### Npm
```
npm install
npm run build
```
Result will appear in `dist` directory.
## PayPal Sponsors
<a href="https://edubirdie.com/write-my-essay" target="_blank"><img height="64" src="https://bootstrap-table.com/assets/images/edu-birdie.png" alt="Write my essay services from Edubirdie"></a>
## OpenCollective Sponsors
Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [[Become a sponsor](https://opencollective.com/bootstrap-table#sponsor)]
<a href="https://opencollective.com/bootstrap-table/sponsor/0/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/0/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/1/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/1/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/2/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/2/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/3/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/3/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/4/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/4/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/5/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/5/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/6/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/6/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/7/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/7/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/8/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/8/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/9/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/9/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/10/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/10/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/11/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/11/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/12/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/12/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/13/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/13/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/14/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/14/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/15/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/15/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/16/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/16/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/17/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/17/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/18/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/18/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/19/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/19/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/20/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/20/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/21/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/21/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/22/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/22/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/23/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/23/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/24/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/24/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/25/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/25/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/26/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/26/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/27/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/27/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/28/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/28/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/29/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/29/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/30/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/30/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/31/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/31/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/32/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/32/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/33/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/33/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/34/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/34/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/35/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/35/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/36/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/36/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/37/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/37/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/38/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/38/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/39/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/39/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/40/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/40/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/41/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/41/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/42/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/42/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/43/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/43/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/44/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/44/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/45/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/45/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/46/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/46/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/47/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/47/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/48/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/48/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/49/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/49/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/sponsor/50/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/sponsor/50/avatar.svg"></a>
## OpenCollective Backers
Support this project by becoming a backer. Your image will show up here with a link to your website. [[Become a backer](https://opencollective.com/bootstrap-table#backer)]
<a href="https://opencollective.com/bootstrap-table/backer/0/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/0/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/1/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/1/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/2/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/2/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/3/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/3/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/4/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/4/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/5/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/5/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/6/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/6/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/7/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/7/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/8/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/8/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/9/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/9/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/10/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/10/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/11/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/11/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/12/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/12/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/13/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/13/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/14/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/14/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/15/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/15/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/16/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/16/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/17/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/17/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/18/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/18/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/19/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/19/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/20/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/20/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/21/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/21/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/22/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/22/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/23/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/23/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/24/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/24/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/25/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/25/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/26/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/26/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/27/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/27/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/28/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/28/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/29/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/29/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/30/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/30/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/31/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/31/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/32/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/32/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/33/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/33/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/34/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/34/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/35/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/35/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/36/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/36/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/37/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/37/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/38/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/38/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/39/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/39/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/40/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/40/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/41/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/41/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/42/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/42/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/43/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/43/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/44/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/44/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/45/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/45/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/46/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/46/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/47/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/47/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/48/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/48/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/49/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/49/avatar.svg"></a>
<a href="https://opencollective.com/bootstrap-table/backer/50/website" target="_blank"><img src="https://opencollective.com/bootstrap-table/backer/50/avatar.svg"></a>