Change the way the page number looks like
Change the way the page number looks like

Hi,
I can the the following with dataTables
language: {
paginate: {
next: `<li class='list-inline-item'>
<span class='u-pagination-v1__item u-pagination-v1-1 g-pa-12-21'' aria-label='#{text}'>
<span aria-hidden='true'>
<i class='fa fa-angle-right'></i>
</span>
<span class='sr-only'>Next</span>
</span>
</li>`,
previous: `<li class='list-inline-item'>
<span class='u-pagination-v1__item u-pagination-v1-1 g-pa-12-21'' aria-label='#{text}'>
<span aria-hidden='true'>
<i class='fa fa-angle-left'></i>
</span>
<span class='sr-only'>Previous</span>
</span>
</li>`
}
And this will show the previous and next buttons in a certain way.
But there is no way I could change how the page number looks like - 1,2,3
How could I change it? I have this options
$.fn.DataTable.ext.classes.sPaging = 'pagination ' + $.fn.DataTable.ext.classes.sPaging;
But it is only for the classes
There is some inconsistency between previous,next,last,first that have an API for changing their look and the page number itself for which you have no control
This discussion has been closed.
Answers
For more complex paging, it would be better to create a plugin to add that functionality,
Colin
Thanks @colin. As I understand there is no such plugin and one should be developed?