PJAX / Back-Button destroys datatables

Question

In our Rails 3.2 application with rack-pjax enabled, the following problem appears:

• You click on the link, the page with the data contained in it loads the pjax trough. Everything is good.
• You click on antoher to link to the "anything" page.
• You click the back button, on which the data page is loaded. BUT the data does not work.

Sometimes it loads 2 tables (without data in it), sometimes it loads only the old datatable. but it’s impossible to manipulate the data (search, go to page 2, etc.). It is completely static.

Data for the table is supplied via json (server-side processing) from the application rails part. We have already tried to destroy and rebuild the data to "pjax: start" or "pjax: end"

Thank you for your help:)

Answer 1

I found a working solution reliably, without unforeseen problems.

$(document).ready -> initLeagueIndexDataTable() $(document).on 'pjax:end', -> initLeagueIndexDataTable() initLeagueIndexDataTable : -> if ($('#league_index').length > 0 && !$('#league_index_wrapper').length > 0) $('#league_index').dataTable({ 'sPaginationType': 'full_numbers', 'bJQueryUI': true, 'bProcessing': true, 'bServerSide': true, 'sAjaxSource': $('#league_index').data('source'), 'aoColumnDefs': [ { "bSortable": false, "aTargets": [ 1 ] }, { "bSortable": false, "aTargets": [ 2 ] }, { "bSortable": false, "aTargets": [ 3 ] }, { "bSortable": false, "aTargets": [ 4 ] }, { "bSortable": false, "aTargets": [ 5 ] } ], 'bFilter': false, 'iDisplayLength': 25, 'bDestroy': true })