DataTables隱藏一列，並顯示另一個

我敢肯定，這是可能的一些如何，但我在做什麼是行不通的。DataTables隱藏一列，並顯示另一個

$('#campaign_creative_performance-table #show_thumb').change(function() { 
    var show = ($(this).is(':checked')) ? true : false, 
     oTable = $('#campaign_creative_performance-table table.sortable').dataTable(); 
    oTable.fnSetColumnVis(14, show ? false : true); 
    oTable.fnSetColumnVis(15, show); 
});

這應該是隱藏欄14和顯示欄15，反之亦然。

它正在做的是交換列標題和更改列的寬度，但內容不變。

我試過把第一個重繪標誌，但沒有改變。

附加信息： 我通過sAjaxSource獲取數據並通過fnRowCallback對其進行格式化。對於那些兩列的格式如下：

$('td:eq(14)', nRow).html('<p class="limit160" title="'+aData[14]+'">'+aData[14]+'</p>'); 
$('td:eq(15)', nRow).html('<img src="'+aData[15]+'" />');

進一步調查 的問題是，在fnRowCallback進行格式化。隱藏第14列，使15變成14，因此數據是從數據14中獲得的，而不是15。因此，需要進行某種格式化測試，以確定它實際在做什麼列...或者不要使用$ （'td：eq（14）'）來確定列。我只是不知道該怎麼做。

它不工作的簡化示例是http://jsfiddle.net/NbSCb/ 注意當點擊'click me'時，col3的數據不正確。

來源

2012-10-05 David Fairbanks

有無你試過在最後一個'fnSetColumnVis'後面調用'oTable.dataTable（）;'？ – KRyan

你可以完成刪除'？順便說一句，第二行是true：false。 – Blazemonger

-1

的問題是格式。格式決定必須在fnRowCallback中進行格式化時決定。基本上，如果您隱藏第14列，則第15列將變爲第14列並將其格式化。

解決方案是使用if語句來查看外部複選框的規則。

if($('#show_thumb').is(':checked')) { 
    $('td:eq(14)', nRow).html('<img src="'+aData[15]+'" style="max-height:100px;" />'); 
} else { 
    $('td:eq(14)', nRow).html('<p title="'+aData[14]+'">'+aData[14]+'</p>'); 
}

請注意，這兩個格式化選項都會影響第14行，但分別使用數據點15和14。

來源

2012-10-11 17:02:17

這應該工作。

$('#campaign_creative_performance-table #show_thumb').change(function() { 
    table.fnSetColumnVis(14, !this.checked); 
    table.fnSetColumnVis(15, this.checked); 
});

demo

來源

2012-10-05 17:11:21

你不需要重新創建數據表每.change時間被觸發。這是使用全局變量的好時機：

oTable = $('#campaign_creative_performance-table table.sortable').dataTable(); 

$('#show_thumb').change(function() { 
    var show = $(this).is(':checked'); // Boolean 
    oTable.fnSetColumnVis(4, !show); 
    oTable.fnSetColumnVis(5, show); 
});

http://jsfiddle.net/JPU7A/

來源

2012-10-05 17:20:16 Blazemonger

雖然你的演示工作，但它不起作用在我的網頁上... humm。我從AJAX獲取數據（通過sAjaxSource），然後通過fnRowCallback對其進行格式化。但我不認爲這很重要。 –

我希望你使用'$（document）.ready'包裝器？ – Blazemonger

聽起來像類似這樣的主題問題：

[http://www.datatables.net/forums/discussion/16236/showinghiding-columns-with-ajax/p1][1]

來源

2013-10-08 03:08:37 Gordon

DataTables隱藏一列，並顯示另一個

回答

相關問題