1.
/*! DataTables Bootstrap 4 integration
2.
* ©2011-2017 SpryMedia Ltd - datatables.net/license
3.
*/
4.
5.
/**
6.
* DataTables integration for Bootstrap 4. This requires Bootstrap 4 and
7.
* DataTables 1.10 or newer.
8.
*
9.
* This file sets the defaults and adds options to DataTables to style its
10.
* controls using Bootstrap. See http://datatables.net/manual/styling/bootstrap
11.
* for further information.
12.
*/
13.
(function( factory ){
14.
if ( typeof define === 'function' && define.amd ) {
15.
// AMD
16.
define( ['jquery', 'datatables.net'], function ( $ ) {
17.
return factory( $, window, document );
18.
} );
19.
}
20.
else if ( typeof exports === 'object' ) {
21.
// CommonJS
22.
module.exports = function (root, $) {
23.
if ( ! root ) {
24.
root = window;
25.
}
26.
27.
if ( ! $ || ! $.fn.dataTable ) {
28.
// Require DataTables, which attaches to jQuery, including
29.
// jQuery if needed and have a $ property so we can access the
30.
// jQuery object that is used
31.
$ = require('datatables.net')(root, $).$;
32.
}
33.
34.
return factory( $, root, root.document );
35.
};
36.
}
37.
else {
38.
// Browser
39.
factory( jQuery, window, document );
40.
}
41.
}(function( $, window, document, undefined ) {
42.
'use strict';
43.
var DataTable = $.fn.dataTable;
44.
45.
46.
/* Set the defaults for DataTables initialisation */
47.
$.extend( true, DataTable.defaults, {
48.
dom:
49.
"<'row'<'col-sm-12 col-md-6'l><'col-sm-12 col-md-6'f>>" +
50.
"<'row'<'col-sm-12'tr>>" +
51.
"<'row'<'col-sm-12 col-md-5'i><'col-sm-12 col-md-7'p>>",
52.
renderer: 'bootstrap'
53.
} );
54.
55.
56.
/* Default class modification */
57.
$.extend( DataTable.ext.classes, {
58.
sWrapper: "dataTables_wrapper dt-bootstrap4",
59.
sFilterInput: "form-control form-control-sm",
60.
sLengthSelect: "custom-select custom-select-sm form-control form-control-sm",
61.
sProcessing: "dataTables_processing card",
62.
sPageButton: "paginate_button page-item"
63.
} );
64.
65.
66.
/* Bootstrap paging button renderer */
67.
DataTable.ext.renderer.pageButton.bootstrap = function ( settings, host, idx, buttons, page, pages ) {
68.
var api = new DataTable.Api( settings );
69.
var classes = settings.oClasses;
70.
var lang = settings.oLanguage.oPaginate;
71.
var aria = settings.oLanguage.oAria.paginate || {};
72.
var btnDisplay, btnClass, counter=0;
73.
74.
var attach = function( container, buttons ) {
75.
var i, ien, node, button;
76.
var clickHandler = function ( e ) {
77.
e.preventDefault();
78.
if ( !$(e.currentTarget).hasClass('disabled') && api.page() != e.data.action ) {
79.
api.page( e.data.action ).draw( 'page' );
80.
}
81.
};
82.
83.
for ( i=0, ien=buttons.length ; i<ien ; i++ ) {
84.
button = buttons[i];
85.
86.
if ( $.isArray( button ) ) {
87.
attach( container, button );
88.
}
89.
else {
90.
btnDisplay = '';
91.
btnClass = '';
92.
93.
switch ( button ) {
94.
case 'ellipsis':
95.
btnDisplay = '…';
96.
btnClass = 'disabled';
97.
break;
98.
99.
case 'first':
100.
btnDisplay = lang.sFirst;
101.
btnClass = button + (page > 0 ?
102.
'' : ' disabled');
103.
break;
104.
105.
case 'previous':
106.
btnDisplay = lang.sPrevious;
107.
btnClass = button + (page > 0 ?
108.
'' : ' disabled');
109.
break;
110.
111.
case 'next':
112.
btnDisplay = lang.sNext;
113.
btnClass = button + (page < pages-1 ?
114.
'' : ' disabled');
115.
break;
116.
117.
case 'last':
118.
btnDisplay = lang.sLast;
119.
btnClass = button + (page < pages-1 ?
120.
'' : ' disabled');
121.
break;
122.
123.
default:
124.
btnDisplay = button + 1;
125.
btnClass = page === button ?
126.
'active' : '';
127.
break;
128.
}
129.
130.
if ( btnDisplay ) {
131.
node = $('<li>', {
132.
'class': classes.sPageButton+' '+btnClass,
133.
'id': idx === 0 && typeof button === 'string' ?
134.
settings.sTableId +'_'+ button :
135.
null
136.
} )
137.
.append( $('<a>', {
138.
'href': '#',
139.
'aria-controls': settings.sTableId,
140.
'aria-label': aria[ button ],
141.
'data-dt-idx': counter,
142.
'tabindex': settings.iTabIndex,
143.
'class': 'page-link'
144.
} )
145.
.html( btnDisplay )
146.
)
147.
.appendTo( container );
148.
149.
settings.oApi._fnBindAction(
150.
node, {action: button}, clickHandler
151.
);
152.
153.
counter++;
154.
}
155.
}
156.
}
157.
};
158.
159.
// IE9 throws an 'unknown error' if document.activeElement is used
160.
// inside an iframe or frame.
161.
var activeEl;
162.
163.
try {
164.
// Because this approach is destroying and recreating the paging
165.
// elements, focus is lost on the select button which is bad for
166.
// accessibility. So we want to restore focus once the draw has
167.
// completed
168.
activeEl = $(host).find(document.activeElement).data('dt-idx');
169.
}
170.
catch (e) {}
171.
172.
attach(
173.
$(host).empty().html('<ul class="pagination"/>').children('ul'),
174.
buttons
175.
);
176.
177.
if ( activeEl !== undefined ) {
178.
$(host).find( '[data-dt-idx='+activeEl+']' ).trigger('focus');
179.
}
180.
};
181.
182.
183.
return DataTable;
184.
}));
185.