jquery ajax选项卡和表格工具

Question

我正在使用带有DataTables 1.9.4的jquery 1.7.2和TableTools 2.2.1

我有一个jquery标签和表格工具一起使用的问题。我的一些选项卡是通过ajax调用加载的，而一些选项卡内容在初始化了选项卡的页面上。

但我不能保存为CSV/PDF，当我点击表格按钮。

它在加载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)确实在页面加载时出现，但当我在单击特定选项卡时显式调用它时并没有出现(我在此选项卡上有数据表)，代码片段如下：

$("#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();