вкладок JQuery Ajax и tabletools

Question

Я использую JQuery 1.7.2 и 2.2.1 TableTools с DataTables 1.9.4

У меня есть проблема с JQuery вкладки и tabletools используются вместе. Некоторые из моих вкладок загружаются через ajax-вызов, а некоторые содержимое вкладки находятся на самой странице, которая имеет инициализацию вкладок.

Но я не могу сохранить CSV/PDF, когда я нажимаю на кнопки Tabletool.

Он отлично работает на первой вкладке, которая загружается ajax, но не работает с содержимым вкладки на других вкладках страницы.

Я использовал следующий код для изменения размера кнопок, но результата не получилось, только если у меня нет вкладки, загруженной ajax.

$("#tabs").tabs({ 
    show: function(ui, event) { 
     var ttInstances = TableTools.fnGetMasters(); 
     for (i in ttInstances) { 
      alert(i); 
      if (ttInstances[i].fnResizeRequired()) 
       ttInstances[i].fnResizeButtons(); 
     } 
    } 
}); 

Кроме того, я заметил, что alert(i) приходит, когда страница загружена, но не тогда, когда я явно вызвать его, когда эта вкладка particualr нажата (и у меня есть DataTables на этой вкладке), фрагмент кода ниже :

$("#tabs").tabs({ 
    select: function(event,ui) { 
     alert("tab no :"+ui.panel.id); 
     switch (ui.panel.id) { 
      case "tab_started": 
       alert("hi here"); 
       var ttInstances = TableTools.fnGetMasters(); 
       for (i in ttInstances) { 
        alert(i); 
        if (ttInstances[i].fnResizeRequired()) 
         ttInstances[i].fnResizeButtons(); 
       } 
     } 
}); 

Любая помощь очень ценится. Пожалуйста, дайте любые предложения, чтобы решить эту проблему. Я проверял предыдущие сообщения, но не смог найти точного решения

Answer 1

Со всем, что использует Javascript для инициализации. Вам нужно вызвать инициализацию на той же странице, которую вы вызываете AJAX. Причина, по которой вы хотели бы сделать это, - это загрузить DOM, а затем применить к ним любой Javascript.

Главная страница

<div class='container'></div> 

JS

$.post(link, function (html) { 
    $('.container').html(html) 
}) 

AJAX Страница

<table class='datatable'>data</table> 

JS

/*Init datatable on ajax page.*/ 
$('.datatable').Datatable();