Remove first, and last pagination from the jquery data table

Question

I'm currently using jQuery Datatable. I also use jquery ui to provide good theme. However, I want to disable (hide) the first and last button of the pagination from the table by using a bit customization on jquery library. enter image description here

The problem is that the customization has only 2 methods: full_numbers and two_button.

So how can I get the pagination without the first and last button?

Any help would be very much appreciated.

Thanks

score 16 · Answer 1 · answered Nov 10 '14 at 16:14

16

You have 4 options:

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

So in your case :

$("#youridtable").dataTable(
{
  "pagingType": "simple_numbers"
});

src: http://www.datatables.net/examples/basic_init/alt_pagination.html

answered Nov 10 '14 at 16:14

jteks

603
7
15

Thanks for explanation..great answer @jteks – rahul sharma Aug 17 '17 at 07:22

score 4 · Accepted Answer · answered Jun 05 '12 at 09:39

4

Write your own javascript to hide/remove the elements.

$(".first.paginate_button, .last.paginate_button").hide();

answered Jun 05 '12 at 09:39

Rahul

1,866
17
32

In order to get rid of it, I use `$(".first.paginate_button, .last.paginate_button").remove();` to remove those objects. However, thanks so much for great help. – Tepken Vannkorn Jun 05 '12 at 09:53

score 1 · Answer 3 · edited Jan 21 '14 at 06:58

1

You can always use css

.dataTables_paginate .last{display:none;}

edited Jan 21 '14 at 06:58

Tepken Vannkorn

9,648
14
61
86

answered May 22 '13 at 19:45

user969714

165
1
4

score 1 · Answer 4 · answered May 30 '14 at 11:16

We do not need to use CSS. Just hack into sFirst and sLast options of Datatable:

$(document).ready( function() {
  $('#example').dataTable( {
    "oLanguage": {
      "oPaginate": {
        "sFirst": "",
        "sLast": ""
      }
   }
  });
});

Reference: http://legacy.datatables.net/usage/i18n

Remove first, and last pagination from the jquery data table

4 Answers4