Reputation: 4169
Been integrating the jquery DataTables plugin to my rails app, via the rweng/jquery-datatables-rails gem. It's awesome. I even went so far as to style it with bootstrap.
So, I have bootstrap, and kaminari for pagination (not sure if that matters). There is a kaminari-bootstrap gem as well.
Anyway, the DataTables table shows previous 1 2 3 4 5 next, and it's just chunky. How can I lose the numbers, and just have previoius next?
currently calling datatable with:
jQuery ->
$('#companyBoxList').dataTable
sDom: "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>"
sPaginationType: "bootstrap"
bJQueryUI: true
bProcessing: true
bServerSide: true
sAjaxSource: $('#companyBoxList').data('source')
Upvotes: 5
Views: 36173
Reputation: 641
You have 6 options:
numbers
- Page number buttons onlysimple
- 'Previous' and 'Next' buttons onlysimple_numbers
- 'Previous' and 'Next' buttons, plus page numbersfull
- 'First', 'Previous', 'Next' and 'Last' buttonsfull_numbers
- 'First', 'Previous', 'Next' and 'Last' buttons, plus page numbersfirst_last_numbers
- 'First' and 'Last' buttons, plus page numbersThe numbers
and first_last_numbers
options were recently added.
(src: http://www.datatables.net/examples/basic_init/alt_pagination.html)
So in your case :
// Code jQuery.
$('#companyBoxList').dataTable({
pagingType: "simple"
});
Upvotes: 18
Reputation: 61063
Note that this answer referred to an older version of DataTables. There are now six pagination options:
numbers - Page number buttons only (1.10.8)
simple - 'Previous' and 'Next' buttons only
simple_numbers - 'Previous' and 'Next' buttons, plus page numbers
full - 'First', 'Previous', 'Next' and 'Last' buttons
full_numbers - 'First', 'Previous', 'Next' and 'Last' buttons, plus page numbers
first_last_numbers - 'First' and 'Last' buttons, plus page numbers
http://www.datatables.net/usage/options
sPaginationType
DataTables features two different built-in pagination interaction methods ('twobutton' or 'fullnumbers') which present different page controls to the end user. Further methods can be added using the API (see below).
Update: Apparently the Bootstrap plugin forces its own pagination layout. You could do this instead:
#my_table .pagination li {display: none;}
#my_table .pagination li.prev, #my_table .pagination li.next {display: inline;}
Upvotes: 3