| 4 |
lars |
1 |
/**
|
|
|
2 |
* jQuery DataTables jPaginator plugin v1.0 - integration between DataTables and
|
|
|
3 |
* jPaginator
|
|
|
4 |
* by Ernani Azevedo <azevedo@intellinews.com.br>
|
|
|
5 |
*
|
|
|
6 |
* You'll need jQuery DataTables (http://datatables.net/) and jPaginator
|
|
|
7 |
* (http://remylab.github.com/jpaginator/) loaded before load this one.
|
|
|
8 |
*
|
|
|
9 |
* Full description is available here:
|
|
|
10 |
* http://www.intellinews.com.br/blog/2012/10/26/jquery-datatables-integration-with-jpaginator-4/
|
|
|
11 |
*
|
|
|
12 |
* @license GPL v3.0.
|
|
|
13 |
* @example
|
|
|
14 |
* // Initialise DataTables with jPaginator paging
|
|
|
15 |
* $('#example').dataTable ( {
|
|
|
16 |
* 'sPaginationType': 'jPaginator'
|
|
|
17 |
* } );
|
|
|
18 |
*/
|
|
|
19 |
|
|
|
20 |
// API method to get paging information (Got idea from Twitter Bootstrap plugin):
|
|
|
21 |
$.fn.dataTableExt.oApi.fnPagingInfo = function ( oSettings)
|
|
|
22 |
{
|
|
|
23 |
if ( oSettings)
|
|
|
24 |
{
|
|
|
25 |
return {
|
|
|
26 |
"iStart": oSettings._iDisplayStart,
|
|
|
27 |
"iEnd": oSettings.fnDisplayEnd (),
|
|
|
28 |
"iLength": oSettings._iDisplayLength,
|
|
|
29 |
"iTotal": oSettings.fnRecordsTotal (),
|
|
|
30 |
"iFilteredTotal": oSettings.fnRecordsDisplay (),
|
|
|
31 |
"iPage": Math.ceil ( oSettings._iDisplayStart / oSettings._iDisplayLength),
|
|
|
32 |
"iTotalPages": Math.ceil ( oSettings.fnRecordsDisplay () / oSettings._iDisplayLength)};
|
|
|
33 |
} else {
|
|
|
34 |
return {
|
|
|
35 |
"iStart": 0,
|
|
|
36 |
"iEnd": 0,
|
|
|
37 |
"iLength": 0,
|
|
|
38 |
"iTotal": 0,
|
|
|
39 |
"iFilteredTotal": 0,
|
|
|
40 |
"iPage": 0,
|
|
|
41 |
"iTotalPages": 0
|
|
|
42 |
}
|
|
|
43 |
}
|
|
|
44 |
};
|
|
|
45 |
|
|
|
46 |
// Extends DataTable to support jPaginator pagination style:
|
|
|
47 |
$.fn.dataTableExt.oPagination.jPaginator = {
|
|
|
48 |
'paginator': $('<span>').html ( '<nav id="m_left"></nav><nav id="o_left"></nav><div class="paginator_p_wrap"><div class="paginator_p_bloc"><!--<a class="paginator_p"></a>--></div></div><nav id="o_right"></nav><nav id="m_right"></nav><div class="paginator_slider ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><a class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>'),
|
|
|
49 |
'fnInit': function ( oSettings, nPaging, fnCallbackDraw) {
|
|
|
50 |
$(nPaging).prepend ( this.paginator);
|
|
|
51 |
$(this.paginator).jPaginator ( {
|
|
|
52 |
selectedPage: 1,
|
|
|
53 |
nbPages: 1,
|
|
|
54 |
nbVisible: 6,
|
|
|
55 |
overBtnLeft: '#o_left',
|
|
|
56 |
overBtnRight: '#o_right',
|
|
|
57 |
maxBtnLeft: '#m_left',
|
|
|
58 |
maxBtnRight: '#m_right',
|
|
|
59 |
minSlidesForSlider: 2,
|
|
|
60 |
onPageClicked: function ( a, num) {
|
|
|
61 |
if ( num - 1 == Math.ceil ( oSettings._iDisplayStart / oSettings._iDisplayLength)) {
|
|
|
62 |
return;
|
|
|
63 |
}
|
|
|
64 |
oSettings._iDisplayStart = ( num - 1) * oSettings._iDisplayLength;
|
|
|
65 |
fnCallbackDraw ( oSettings);
|
|
|
66 |
}
|
|
|
67 |
}).addClass ( 'jPaginator');
|
|
|
68 |
},
|
|
|
69 |
'fnUpdate': function ( oSettings, fnCallbackDraw) {
|
|
|
70 |
if ( ! oSettings.aanFeatures.p) {
|
|
|
71 |
return;
|
|
|
72 |
}
|
|
|
73 |
var oPaging = oSettings.oInstance.fnPagingInfo ();
|
|
|
74 |
$(this.paginator).trigger ( 'reset', { nbVisible: 6, selectedPage: oPaging.iPage + 1, nbPages: oPaging.iTotalPages});
|
|
|
75 |
}
|
|
|
76 |
};
|