From dec9bace323a3ca5f88cdc5bc431eeeb92b82821 Mon Sep 17 00:00:00 2001 From: Allan Jardine Date: Mon, 12 Aug 2013 13:38:50 +0100 Subject: [PATCH] Bootstrap integration - Provide different files for the different Bootstrap versions - Bootstrap 3 integration with the small updates required - Examples for v2 and v3 of Bootstrap. I couldn't find v1 on a CDN so I've not included an example there --- .../bootstrap/1/dataTables.bootstrap.css | 28 ++ .../bootstrap/1/dataTables.bootstrap.js | 78 +++- .../{ => 2}/dataTables.bootstrap.css | 10 +- .../bootstrap/{ => 2}/dataTables.bootstrap.js | 0 integration/bootstrap/2/index.html | 442 ++++++++++++++++++ .../bootstrap/3/dataTables.bootstrap.css | 199 ++++++++ .../dataTables.bootstrap.js} | 6 +- integration/bootstrap/3/index.html | 442 ++++++++++++++++++ 8 files changed, 1179 insertions(+), 26 deletions(-) create mode 100644 integration/bootstrap/1/dataTables.bootstrap.css rename pagination/bootstrap3.js => integration/bootstrap/1/dataTables.bootstrap.js (67%) rename integration/bootstrap/{ => 2}/dataTables.bootstrap.css (87%) rename integration/bootstrap/{ => 2}/dataTables.bootstrap.js (100%) create mode 100644 integration/bootstrap/2/index.html create mode 100644 integration/bootstrap/3/dataTables.bootstrap.css rename integration/bootstrap/{dataTables.bootstrap3.js => 3/dataTables.bootstrap.js} (96%) create mode 100644 integration/bootstrap/3/index.html diff --git a/integration/bootstrap/1/dataTables.bootstrap.css b/integration/bootstrap/1/dataTables.bootstrap.css new file mode 100644 index 0000000..b6850a0 --- /dev/null +++ b/integration/bootstrap/1/dataTables.bootstrap.css @@ -0,0 +1,28 @@ +div.dataTables_length label { + width: 460px; + float: left; + text-align: left; +} + +div.dataTables_length select { + width: 75px; +} + +div.dataTables_filter label { + float: right; + width: 460px; +} + +div.dataTables_info { + padding-top: 8px; +} + +div.dataTables_paginate { + float: right; + margin: 0; +} + +table { + margin: 1em 0; + clear: both; +} \ No newline at end of file diff --git a/pagination/bootstrap3.js b/integration/bootstrap/1/dataTables.bootstrap.js similarity index 67% rename from pagination/bootstrap3.js rename to integration/bootstrap/1/dataTables.bootstrap.js index f867f66..0c3a76f 100644 --- a/pagination/bootstrap3.js +++ b/integration/bootstrap/1/dataTables.bootstrap.js @@ -1,18 +1,19 @@ -/** - * This plug-in provides the mark-up needed for using Twitter Bootstrap's - * pagination styling with DataTables. Note that this plug-in uses the - * fnPagingInfo API plug-in method to obtain paging information. - * @name Twitter Bootstrap - * @anchor bootstrap - * @author Allan Jardine - * - * @example - * $(document).ready(function() { - * $('#example').dataTable( { - * "sPaginationType": "bootstrap" - * } ); - * } ); - */ +/* Set the defaults for DataTables initialisation */ +$.extend( true, $.fn.dataTable.defaults, { + "sDom": "<'row'<'span8'l><'span8'f>r>t<'row'<'span8'i><'span8'p>>", + "sPaginationType": "bootstrap", + "oLanguage": { + "sLengthMenu": "_MENU_ records per page" + } +} ); + + +/* Default class modification */ +$.extend( $.fn.dataTableExt.oStdClasses, { + "sSortAsc": "header headerSortDown", + "sSortDesc": "header headerSortUp", + "sSortable": "header" +} ); /* API method to get paging information */ @@ -44,8 +45,8 @@ $.extend( $.fn.dataTableExt.oPagination, { } }; - $(nPaging).append( - '