dataTables.bootstrap.js 9.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246
  1. /* Set the defaults for DataTables initialisation */
  2. $.extend(true, $.fn.dataTable.defaults, {
  3. "sDom": "<'row'<'col-sm-6'l><'col-sm-6'f>r>" + "t" + "<'row'<'col-sm-6'i><'col-sm-6'p>>",
  4. "oLanguage": {
  5. "sLengthMenu": "每页 _MENU_ 条记录"
  6. }
  7. });
  8. /* Default class modification */
  9. $.extend($.fn.dataTableExt.oStdClasses, {
  10. "sWrapper": "dataTables_wrapper form-inline",
  11. "sFilterInput": "form-control input-sm",
  12. "sLengthSelect": "form-control input-sm"
  13. });
  14. // In 1.10 we use the pagination renderers to draw the Bootstrap paging,
  15. // rather than custom plug-in
  16. if ($.fn.dataTable.Api) {
  17. $.fn.dataTable.defaults.renderer = 'bootstrap';
  18. $.fn.dataTable.ext.renderer.pageButton.bootstrap = function(settings, host, idx, buttons, page, pages) {
  19. var api = new $.fn.dataTable.Api(settings);
  20. var classes = settings.oClasses;
  21. var lang = settings.oLanguage.oPaginate;
  22. var btnDisplay, btnClass;
  23. var attach = function(container, buttons) {
  24. var i, ien, node, button;
  25. var clickHandler = function(e) {
  26. e.preventDefault();
  27. if (e.data.action !== 'ellipsis') {
  28. api.page(e.data.action).draw(false);
  29. }
  30. };
  31. for (i = 0, ien = buttons.length; i < ien; i++) {
  32. button = buttons[i];
  33. if ($.isArray(button)) {
  34. attach(container, button);
  35. } else {
  36. btnDisplay = '';
  37. btnClass = '';
  38. switch (button) {
  39. case 'ellipsis':
  40. btnDisplay = '&hellip;';
  41. btnClass = 'disabled';
  42. break;
  43. case 'first':
  44. btnDisplay = lang.sFirst;
  45. btnClass = button + (page > 0 ?
  46. '' : ' disabled');
  47. break;
  48. case 'previous':
  49. btnDisplay = lang.sPrevious;
  50. btnClass = button + (page > 0 ?
  51. '' : ' disabled');
  52. break;
  53. case 'next':
  54. btnDisplay = lang.sNext;
  55. btnClass = button + (page < pages - 1 ?
  56. '' : ' disabled');
  57. break;
  58. case 'last':
  59. btnDisplay = lang.sLast;
  60. btnClass = button + (page < pages - 1 ?
  61. '' : ' disabled');
  62. break;
  63. default:
  64. btnDisplay = button + 1;
  65. btnClass = page === button ?
  66. 'active' : '';
  67. break;
  68. }
  69. if (btnDisplay) {
  70. node = $('<li>', {
  71. 'class': classes.sPageButton + ' ' + btnClass,
  72. 'aria-controls': settings.sTableId,
  73. 'tabindex': settings.iTabIndex,
  74. 'id': idx === 0 && typeof button === 'string' ? settings.sTableId + '_' + button : null
  75. })
  76. .append($('<a>', {
  77. 'href': '#'
  78. })
  79. .html(btnDisplay)
  80. )
  81. .appendTo(container);
  82. settings.oApi._fnBindAction(
  83. node, {
  84. action: button
  85. }, clickHandler
  86. );
  87. }
  88. }
  89. }
  90. };
  91. attach(
  92. $(host).empty().html('<ul class="pagination"/>').children('ul'),
  93. buttons
  94. );
  95. }
  96. } else {
  97. // Integration for 1.9-
  98. $.fn.dataTable.defaults.sPaginationType = 'bootstrap';
  99. /* API method to get paging information */
  100. $.fn.dataTableExt.oApi.fnPagingInfo = function(oSettings) {
  101. return {
  102. "iStart": oSettings._iDisplayStart,
  103. "iEnd": oSettings.fnDisplayEnd(),
  104. "iLength": oSettings._iDisplayLength,
  105. "iTotal": oSettings.fnRecordsTotal(),
  106. "iFilteredTotal": oSettings.fnRecordsDisplay(),
  107. "iPage": oSettings._iDisplayLength === -1 ? 0 : Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength),
  108. "iTotalPages": oSettings._iDisplayLength === -1 ? 0 : Math.ceil(oSettings.fnRecordsDisplay() / oSettings._iDisplayLength)
  109. };
  110. };
  111. /* Bootstrap style pagination control */
  112. $.extend($.fn.dataTableExt.oPagination, {
  113. "bootstrap": {
  114. "fnInit": function(oSettings, nPaging, fnDraw) {
  115. var oLang = oSettings.oLanguage.oPaginate;
  116. var fnClickHandler = function(e) {
  117. e.preventDefault();
  118. if (oSettings.oApi._fnPageChange(oSettings, e.data.action)) {
  119. fnDraw(oSettings);
  120. }
  121. };
  122. $(nPaging).append(
  123. '<ul class="pagination">' +
  124. '<li class="prev disabled"><a href="#">&larr; ' + oLang.sPrevious + '</a></li>' +
  125. '<li class="next disabled"><a href="#">' + oLang.sNext + ' &rarr; </a></li>' +
  126. '</ul>'
  127. );
  128. var els = $('a', nPaging);
  129. $(els[0]).bind('click.DT', {
  130. action: "previous"
  131. }, fnClickHandler);
  132. $(els[1]).bind('click.DT', {
  133. action: "next"
  134. }, fnClickHandler);
  135. },
  136. "fnUpdate": function(oSettings, fnDraw) {
  137. var iListLength = 5;
  138. var oPaging = oSettings.oInstance.fnPagingInfo();
  139. var an = oSettings.aanFeatures.p;
  140. var i, ien, j, sClass, iStart, iEnd, iHalf = Math.floor(iListLength / 2);
  141. if (oPaging.iTotalPages < iListLength) {
  142. iStart = 1;
  143. iEnd = oPaging.iTotalPages;
  144. } else if (oPaging.iPage <= iHalf) {
  145. iStart = 1;
  146. iEnd = iListLength;
  147. } else if (oPaging.iPage >= (oPaging.iTotalPages - iHalf)) {
  148. iStart = oPaging.iTotalPages - iListLength + 1;
  149. iEnd = oPaging.iTotalPages;
  150. } else {
  151. iStart = oPaging.iPage - iHalf + 1;
  152. iEnd = iStart + iListLength - 1;
  153. }
  154. for (i = 0, ien = an.length; i < ien; i++) {
  155. // Remove the middle elements
  156. $('li:gt(0)', an[i]).filter(':not(:last)').remove();
  157. // Add the new list items and their event handlers
  158. for (j = iStart; j <= iEnd; j++) {
  159. sClass = (j == oPaging.iPage + 1) ? 'class="active"' : '';
  160. $('<li ' + sClass + '><a href="#">' + j + '</a></li>')
  161. .insertBefore($('li:last', an[i])[0])
  162. .bind('click', function(e) {
  163. e.preventDefault();
  164. oSettings._iDisplayStart = (parseInt($('a', this).text(), 10) - 1) * oPaging.iLength;
  165. fnDraw(oSettings);
  166. });
  167. }
  168. // Add / remove disabled classes from the static elements
  169. if (oPaging.iPage === 0) {
  170. $('li:first', an[i]).addClass('disabled');
  171. } else {
  172. $('li:first', an[i]).removeClass('disabled');
  173. }
  174. if (oPaging.iPage === oPaging.iTotalPages - 1 || oPaging.iTotalPages === 0) {
  175. $('li:last', an[i]).addClass('disabled');
  176. } else {
  177. $('li:last', an[i]).removeClass('disabled');
  178. }
  179. }
  180. }
  181. }
  182. });
  183. }
  184. /*
  185. * TableTools Bootstrap compatibility
  186. * Required TableTools 2.1+
  187. */
  188. if ($.fn.DataTable.TableTools) {
  189. // Set the classes that TableTools uses to something suitable for Bootstrap
  190. $.extend(true, $.fn.DataTable.TableTools.classes, {
  191. "container": "DTTT btn-group",
  192. "buttons": {
  193. "normal": "btn btn-default",
  194. "disabled": "disabled"
  195. },
  196. "collection": {
  197. "container": "DTTT_dropdown dropdown-menu",
  198. "buttons": {
  199. "normal": "",
  200. "disabled": "disabled"
  201. }
  202. },
  203. "print": {
  204. "info": "DTTT_print_info modal"
  205. },
  206. "select": {
  207. "row": "active"
  208. }
  209. });
  210. // Have the collection use a bootstrap compatible dropdown
  211. $.extend(true, $.fn.DataTable.TableTools.DEFAULTS.oTags, {
  212. "collection": {
  213. "container": "ul",
  214. "button": "li",
  215. "liner": "a"
  216. }
  217. });
  218. }