無法獲取數據表和jQuery標籤正確地顯示

存在的DataTable網站上工作的例子在這裏： http://datatables.net/release-datatables/examples/api/tabs_and_scrolling.html 無法獲取數據表和jQuery標籤正確地顯示

，但我相信例子是使用jQuery UI的1.8的東西，這個例子對於沒有長工作新版本的jquery-ui。具體驗證碼：

"show": function(event, ui) { 
    var table = $.fn.dataTable.fnTables(true); 
    if (table.length > 0) { 
    $(table).dataTable().fnAdjustColumnSizing(); 
    } 
}

我相信「秀」事件被棄用：

我試着用「激活」替換「秀」，但它似乎並沒有工作。有其他人有這個問題嗎？我無法弄清楚如何使它工作。

來源

2013-06-18 user1096865

如果更換「秀」與「激活」，該事件被正確調用，如柱的大小時，也jQuery UI的1.10.x（最新） - 也沒有「激活」選項卡和表被初始化正確。什麼不行？你確定你已經正確加載jQueru UI js/css嗎？ – davidkonrad

我真的希望他們有一個例子，其中數據表存在多個ajax元素而不是單個頁面。 – JM4

這是一個使用activate以及最新版本的jQuery和jQuery UI http://jsfiddle.net/5AavQ/3/的工作示例。檢查外部資源查看包含哪些文件。確保包含所有外部.js（jQuery，jQuery UI，DataTables）和.css（jQuery UI，DataTables Demo是可選的）文件。

來源

2013-06-19 13:14:41

不，show是與jQuery UI選項卡明顯相關的。用'activate'替換'show'是正確的。正如jQuery文檔所說，「show」已被定義爲從UI 1.10中刪除... – davidkonrad

這是一個分叉的jsFiddle http://jsfiddle.net/tNRwZ/ - 與「工作」示例相比：沒有激活列永遠不會調整大小（該事件從未被稱爲） – davidkonrad

謝謝，davidkonrad。我從我的答案中刪除了錯誤的假設，並更新了jsfiddle的鏈接。 –

我剛剛在another thread上發佈了針對此問題的工作解決方案。適用於多個選項卡中的多個表格。下面是代碼：

$(function() { 

// INIT TABS WITH DATATABLES 
$("#TabsId").tabs({ 
activate: function (event, ui) { 
    var oTable = $('div.dataTables_scrollBody>table:visible', ui.panel).dataTable(); 
    if (oTable.length > 0) { 
     oTable.fnAdjustColumnSizing(); 
    } 
} 
}); 

// INIT DATATABLES 
// options for datatables 
var optDataTables = { 
"sScrollY": "200px", 
"bScrollCollapse": true, 
"bPaginate": false, 
"bJQueryUI": true, 
"aoColumnDefs": [ 
    { "sWidth": "10%", "aTargets": [-1] } 
] 
}; 
// initialize data table 
$('table').dataTable(optDataTables); 

});

來源

2013-10-02 09:41:27

myTab3是標籤的ID

$('#myTab3 a[data-toggle="tab"]').on('shown.bs.tab', function (e) { 
      // FYP-table is id of datatable 
      $('#FYP-table').dataTable().fnAdjustColumnSizing(); 

     });

來源

2017-05-02 14:18:33

無法獲取數據表和jQuery標籤正確地顯示

回答

相關問題