Skip to content

Commit

Permalink
Updated for DataTables 1.10.0.
Browse files Browse the repository at this point in the history
  • Loading branch information
comanche committed May 10, 2014
1 parent d7dfd51 commit 78a5ba0
Show file tree
Hide file tree
Showing 26 changed files with 43 additions and 43 deletions.
26 changes: 13 additions & 13 deletions README.md
Expand Up @@ -19,22 +19,22 @@ Add the following viewport meta tag to your HTML's head section:

Add Bootstrap, Datatables-Bootstrap and responsive Datatables helper CSS files.

**DataTables 1.x and Bootstrap 3.x**
**DataTables 1.9.x and Bootstrap 3.x**

```html
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"/>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/3/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/3/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="../../files/1/css/datatables.responsive.css"/>
```
If you are using Bootstrap 2, see the `ajax-bootstrap2.html` example.

**DataTables 2.x and Bootstrap 3.x**
**DataTables 1.10.x and Bootstrap 3.x**

```html
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"/>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/3/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/3/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="../../files/2/css/datatables.responsive.css"/>
```

Expand All @@ -50,20 +50,20 @@ For Bootstrap 3, see

Add jQuery, Datatables, Datables-Bootstrap and the responsive Datatables helper scripts.

**DataTables 1.x and Bootstrap 3.x**
**DataTables 1.9.x and Bootstrap 3.x**

```html
<script src="//code.jquery.com/jquery.min.js"></script>
<script src="//cdn.datatables.net/1.9.4/js/jquery.dataTables.min.js"></script>
<script src="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/3/dataTables.bootstrap.js"></script>
<script src="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/3/dataTables.bootstrap.js"></script>
<script src="../../files/1/js/datatables.responsive.js"></script>
```
**DataTables 2.x and Bootstrap 3.x**
**DataTables 1.10.x and Bootstrap 3.x**

```html
<script src="//code.jquery.com/jquery.min.js"></script>
<script src="//datatables.net/download/build/nightly/jquery.dataTables.min.js?_=196d0219f598ce19c84c48d0557e51d3"></script>
<script src="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/3/dataTables.bootstrap.js"></script>
<script src="//cdn.datatables.net/1.10.0/js/jquery.dataTables.min.js"></script>
<script src="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/3/dataTables.bootstrap.js"></script>
<script src="../../files/2/js/datatables.responsive.js"></script>
```

Expand All @@ -82,14 +82,14 @@ var tableElement = $('#example');
## Create Datatables Instance
Create the datatables instance with the following

### DataTables 1.x
### DataTables 1.9.x

- Set `bAutoWidth` to `false`.
- Set `fnPreDrawCallback` to only initialize the responsive datatables helper once
- Set `fnRowCallback` to create expand icon.
- Set `fnDrawCallback` to respond to window `resize` events.

**DataTables 1.x and Responsive Helper Initialization**
**DataTables 1.9.x and Responsive Helper Initialization**

```javascript
tableElement.dataTable({
Expand Down Expand Up @@ -118,14 +118,14 @@ tableElement.dataTable({
});
```

### DataTables 2.x
### DataTables 1.10.x

- Set `autoWidth` to `false`.
- Set `preDrawCallback` to only initialize the responsive datatables helper once
- Set `rowCallback` to create expand icon.
- Set `drawCallback` to respond to window `resize` events.

**DataTables 2.x and Responsive Helper Initialization**
**DataTables 1.10.x and Responsive Helper Initialization**

```javascript
tableElement.dataTable({
Expand Down
Expand Up @@ -6,8 +6,8 @@
<title>DataTables Example</title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"/>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/3/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="../../files/2/css/datatables.responsive.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/3/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="../../files/1.10/css/datatables.responsive.css"/>
<style>
.title {
font-size: larger;
Expand Down Expand Up @@ -58,9 +58,9 @@
</div>

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="//datatables.net/download/build/nightly/jquery.dataTables.min.js?_=196d0219f598ce19c84c48d0557e51d3"></script>
<script src="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/3/dataTables.bootstrap.js"></script>
<script src="../../files/2/js/datatables.responsive.js"></script>
<script src="//cdn.datatables.net/1.10.0/js/jquery.dataTables.min.js"></script>
<script src="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/3/dataTables.bootstrap.js"></script>
<script src="../../files/1.10/js/datatables.responsive.js"></script>
<script src="js/ajax-bootstrap3.js"></script>
</body>
</html>
File renamed without changes.
Expand Up @@ -6,8 +6,8 @@
<title>DataTables Example</title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"/>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/3/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="../../files/2/css/datatables.responsive.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/3/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="../../files/1.10/css/datatables.responsive.css"/>
<style>
.title {
font-size: larger;
Expand Down Expand Up @@ -515,9 +515,9 @@
</div>

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="//datatables.net/download/build/nightly/jquery.dataTables.min.js?_=196d0219f598ce19c84c48d0557e51d3"></script>
<script src="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/3/dataTables.bootstrap.js"></script>
<script src="../../files/2/js/datatables.responsive.js"></script>
<script src="//cdn.datatables.net/1.10.0/js/jquery.dataTables.min.js"></script>
<script src="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/3/dataTables.bootstrap.js"></script>
<script src="../../files/1.10/js/datatables.responsive.js"></script>
<script src="js/dom-bootstrap3.js"></script>
</body>
</html>
File renamed without changes.
File renamed without changes.
Expand Up @@ -5,8 +5,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title></title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/2/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="../../files/1/css/datatables.responsive.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/2/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="../../files/1.9/css/datatables.responsive.css"/>
<style>
.title {
font-size: larger;
Expand Down Expand Up @@ -72,8 +72,8 @@

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="//cdn.datatables.net/1.9.4/js/jquery.dataTables.min.js"></script>
<script src="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/2/dataTables.bootstrap.js"></script>
<script src="../../files/1/js/datatables.responsive.js"></script>
<script src="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/2/dataTables.bootstrap.js"></script>
<script src="../../files/1.9/js/datatables.responsive.js"></script>
<script src="js/ajax-bootstrap2-recreate-table.js"></script>
</body>
</html>
Expand Up @@ -5,8 +5,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title></title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/2/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="../../files/1/css/datatables.responsive.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/2/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="../../files/1.9/css/datatables.responsive.css"/>
<style>
.title {
font-size: larger;
Expand Down Expand Up @@ -58,8 +58,8 @@

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="//cdn.datatables.net/1.9.4/js/jquery.dataTables.min.js"></script>
<script src="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/2/dataTables.bootstrap.js"></script>
<script src="../../files/1/js/datatables.responsive.js"></script>
<script src="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/2/dataTables.bootstrap.js"></script>
<script src="../../files/1.9/js/datatables.responsive.js"></script>
<script src="js/ajax-bootstrap2.js"></script>
</body>
</html>
Expand Up @@ -6,8 +6,8 @@
<title></title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"/>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/3/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="../../files/1/css/datatables.responsive.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/3/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="../../files/1.9/css/datatables.responsive.css"/>
<style>
.title {
font-size: larger;
Expand Down Expand Up @@ -57,8 +57,8 @@

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="//cdn.datatables.net/1.9.4/js/jquery.dataTables.min.js"></script>
<script src="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/3/dataTables.bootstrap.js"></script>
<script src="../../files/1/js/datatables.responsive.js"></script>
<script src="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/3/dataTables.bootstrap.js"></script>
<script src="../../files/1.9/js/datatables.responsive.js"></script>
<script src="js/ajax-bootstrap3.js"></script>
</body>
</html>
File renamed without changes.
File renamed without changes.
Expand Up @@ -5,8 +5,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title></title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/2/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="../../files/1/css/datatables.responsive.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/2/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="../../files/1.9/css/datatables.responsive.css"/>
<style>
.title {
font-size: larger;
Expand Down Expand Up @@ -115,8 +115,8 @@

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="//cdn.datatables.net/1.9.4/js/jquery.dataTables.min.js"></script>
<script src="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/2/dataTables.bootstrap.js"></script>
<script src="../../files/1/js/datatables.responsive.js"></script>
<script src="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/2/dataTables.bootstrap.js"></script>
<script src="../../files/1.9/js/datatables.responsive.js"></script>
<script src="js/dom-bootstrap2-multiple-table.js"></script>
</body>
</html>
Expand Up @@ -5,8 +5,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title></title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/2/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="../../files/1/css/datatables.responsive.css"/>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/2/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="../../files/1.9/css/datatables.responsive.css"/>
<style>
.title {
font-size: larger;
Expand Down Expand Up @@ -445,8 +445,8 @@

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="//cdn.datatables.net/1.9.4/js/jquery.dataTables.min.js"></script>
<script src="//cdn.datatables.net/plug-ins/505bef35b56/integration/bootstrap/2/dataTables.bootstrap.js"></script>
<script src="../../files/1/js/datatables.responsive.js"></script>
<script src="//cdn.datatables.net/plug-ins/e9421181788/integration/bootstrap/2/dataTables.bootstrap.js"></script>
<script src="../../files/1.9/js/datatables.responsive.js"></script>
<script src="js/dom-bootstrap2.js"></script>
</body>
</html>
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes
File renamed without changes
File renamed without changes.
File renamed without changes.
File renamed without changes
File renamed without changes
File renamed without changes.

0 comments on commit 78a5ba0

Please sign in to comment.