[Pagination] How do I change the pagination to a ?

codingismypassion

This question is similar to https://datatables.net/forums/discussion/71404/accessibility-pagination-using-actual-buttons-instead-of-links? , where I intend to change tha <a> in the pagination <li> to <button>. However, the JS Bin in that question does not show how the <a> are changed to <button> . How do I add it to my HTML?

colin

The first example in the post you linked to has that (use <button> elements) - it's this one here: http://live.datatables.net/kayiwoba/1/edit

You could use that plugin code as the basis for your changes,

Colin

codingismypassion

@colin I don't quite get it, as I can see that in the example, the paging numbers are indeed buttons instead of links, but how do I change it? I'm unsure as to which part of the plugin JS code I should be including to achieve the <button>

colin

If you search for the lines

if ( btnDisplay !== null ) {
    node = $('<button>', {
        'class': classes.sPageButton+' '+btnClass,

you'll see where the button is being created. You'll need to modify it around there,

Colin

allan

I've gone ahead and made a little tweak to DataTables to add a new pagingTag option which can be used to set the element that can be used.

Use:

new DataTable('#myTable', {
  pagingTag: 'button'
});

http://live.datatables.net/xoqebozi/1/edit

The nightly has this change now and I'll do a release with the change soon.

This new option is just temporary until DataTables 2 is available (ETA - currently unknown!) at which point it will have no effect (button will be used).

Allan