I’m trying to integrate DataTables.js (http://datatables.net) with an app which uses twitter bootstrap library. It seems like DataTable doesn’t work well with twitter bootstrap. I’m not sure its the css or js thats conflicting.
How can I integrate DataTables.js with Twitter Bootstrap? Are there any other data tables libraries that work well with Twitter Bootstrap?
It is actually quite easy to integrate Bootstrap and DataTables such that your fully featured DataTables will match the same look and feel of the rest of your site.
Here is the link : http://datatables.net/blog/Twitter_Bootstrap
For Bootstrap v2.x.x: http://datatables.net/blog/Twitter_Bootstrap_2
For Bootstrap 3, use this plugin.
This repository contains a collection of plug-ins
for the jQuery DataTables table enhancer. These plug-ins are feature
enhancing for the DataTables library, adding extra options to core
functionality such as additional sort algorithms, API methods and
pagination controls. The plug-ins should not be confused with
DataTables “extras” which are more significant software libraries
which add additional features to DataTables.
Use Download Builder to generate links to JS/CSS files and include Bootstrap styling and Twitter Bootstrap library (if needed).
Include generated JS/CSS links into your project.
table table-striped table-borderedfor your
<table>as shown below:
<table id="example" class="table table-striped table-bordered" cellspacing="0" width="100%">
See this jsFiddle for code and demonstration.
- Database Administration Tutorials
- Programming Tutorials & IT News
- Linux & DevOps World
- Ebook Reviews
- PES Matches, Skills & News