javascript - Displaying pages without ellipses in the pagination control of a datatable -
i using jquery datatables js bootstrap, running issue there workaround not nicest.
the issue: table contains more 4k records
if person working on table needs work record 200 300 , easibility, needs see 10 records in page, can click on 5 on page number, , on 6, on 7 , way page 20. (i know work around display 100 records , click on page 3 start 200, mentioned due job easier them see no more 10-20 records per page).
the image below shows unable go other pages other first,last, next or previous once reach page 5
is there settings can display pages?
this table processed server side, , have added option:
'spaginationtype' : 'full_numbers',
edit:
<link rel="stylesheet" media="screen" href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" /> <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet" /> <link href="//cdn.datatables.net/tabletools/2.2.2/css/datatables.tabletools.css" rel="stylesheet" type="text/css" /> <link href="//cdn.datatables.net/1.10.7/css/jquery.datatables.min.css" rel="stylesheet" type="text/css" /> <script src="//code.jquery.com/jquery.js"></script> <script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> <script type="text/javascript" src="//cdn.datatables.net/1.10.7/js/jquery.datatables.min.js"></script> <script type="text/javascript" src="//cdn.datatables.net/plug-ins/9dcbecd42ad/integration/bootstrap/3/datatables.bootstrap.js"></script> <script type="text/javascript" src="//cdn.datatables.net/plug-ins/1.10.7/pagination/ellipses.js"></script> <script type="text/javascript" src="//cdn.datatables.net/plug-ins/1.10.7/pagination/select.js"></script> j$(document).ready(function() { j$('#sharktanktable').datatable({ 'aocolumns': aocolumns, 'spaginationtype': 'listbox', // 'pagelength': 10, // // 'spaginationtype': 'ellipses', // 'ishowpages': 10, 'bprocessing': true, 'bserverside': true, // 'spaginationtype' : 'full_numbers', 'sdom': 't<"clear">lfrtip', 'bfilter': true, 'tabletools':{"sswfpath": "//cdnjs.cloudflare.com/ajax/libs/datatables-tabletools/2.1.5/swf/copy_csv_xls_pdf.swf"}, 'sajaxsource': 'fakeurl', 'fnserverdata': function(ssource, aodata, fncallback) { .....
problem
latest version of datatables 1.10.7 not have ability default.
there pagination plug-ins provide additional functionality. 1 of them, ellipses, has ishowpages
option allowing define number of pages display in pagination control.
however per @davidkonrad's note, ellipses plug-in doesn't support datatables 1.10, i.e. doesn't show selected page , disabled state of buttons.
solution
see this answer or jquery datatables – pagination without ellipses better solution.
Comments
Post a Comment