How to create datatable "two_button" pagination with custom Previous and Next images?

DatatablesUser1

My current requirement is as follows.
At the bottom of the table, I need pagination in format : Previous button image say left arrow, text "Page", , text "of" , , Next button image say Right arrow. Eg. <- Page 1 of 18 ->. Highlighting box to appear around current page. Other default enabling and disabling behavior such as Previous button disabled when viewing page 1 etc. stand.

I have been breaking head to locate sample code for this requirement on the web and bible "https://datatables.net/", but no luck. I don't really understand "jquer.datatables.min.js" code so that I could help myself by trying different combinations. I could not find tutorials for this purpose. Do you really need to understand source code or simply know the usage for my requirement?

This not being a code related question, no code to upload as test case.

Thanks in advance.

Best regards,
Girish Varde

DatatablesUser1

I have following code in my jsp file. Same for fnInitComplee()
[code]
"fnDrawCallback":function(){
var iPages = Math.ceil((this.fnSettings().fnRecordsDisplay()) / this.fnSettings()._iDisplayLength);
var iCurrentPage = Math.ceil(this.fnSettings()._iDisplayStart / this.fnSettings()._iDisplayLength) + 1;
alert("iCurrentPage is " + iCurrentPage + " and iPages is " + iPages);
this.fnSettings().oLanguage.sInfo = "Page " + iCurrentPage + " of " + iPages;
alert("this.fnSettings().oLanguage.sInfo is " + this.fnSettings().oLanguage.sInfo );
},
[/code]
It gives correct page numbers in alerts eg. Pg 2 of 4 etc. but fails to show in sInfo text.
For the first time, first page is showing default sInfo - Showing 2 of 8 entries etc. thus sInfo is not updated. Later it shows Page 1 of 4 etc. but this is lagging one click, that is previous click's correct message.
Any suggestion is highly appreciated.
Thanks.
Girish Varde

allan

You could use oLanguage.sNext / oLanguage.sPrevious to put different text input the buttons, including HTML if you wanted. But you can also use CSS - specifically look for the class `paginate_disabled_previous` in the DataTables 1.9.4 demo CSS file (and other related classes of course).

Allan

stla

Rather [code]oLanguage.oPaginate.sNext [/code].
http://datatables.net/usage/i18n

allan

Oops - yes. Good point :-)

Allan