TableTools - How To Hide Columns When exporting/copying

dobulet302

I have a column in my table that is used for links, I do not want this column to show up when you decide to export to csv or use the copy to clipboard function. I searched all around and couldn't find a solution. Anyone know how I can make this happen?

allan

In TableTools what you can do is make the column hidden and not have TableTools export hidden columns. Bit of a pants solution though...

TableTools 2 has the ability to define which columns you want to have exported or not. Ping me using the form at http://datatables.net/contact and I can send you a development copy of TableTools 2 if you like.

Allan

peterkronenberg

When will TableTools 2 be out?

allan

It basically needs the documentation written (and a few things tidied up in the code / API to make it a bit cleaner). However getting the time to writing it up is proving to be fairly difficult...

Allan

edtd

I just downloaded TableTools 2 and have combed through the documentation but wasn't able to find the answer to the original question anywhere. Did excluding columns during export make the 2.0 cut? If it did, would you mind giving a quick explanation of how to indicate which columns should be exported?

allan

Certainly - it is provided through the mColumns option: http://datatables.net/extras/tabletools/button_options#mColumns . There is a code example if you follow that page. Basically you can set it to be either 'all', 'hidden', 'visible' or an array of column indexes you wish to be exported. Any questions just post back here :-)

Allan

edtd

Thanks Allan.

I used the following code and everything except the print button worked as expected:
[code]
$('#datatable').dataTable({
"sScrollY": "350px",
"bPaginate": false,
"sDom": 'lfrtip<"clear spacer">T',
"oTableTools": {
"sSwfPath": "/flash/copy_cvs_xls_pdf.swf",
"aButtons": [
{
"sExtends": "copy",
"mColumns": [0, 1, 3, 4]
},
{
"sExtends": "csv",
"mColumns": [0, 1, 3, 4]
},
{
"sExtends": "pdf",
"mColumns": [0, 1, 3, 4]
},
{
"sExtends": "print",
"mColumns": [0, 1, 3, 4]
},
]
}
});
[/code]

The print button doesn't respect the "mColumns" parameter. It prints all visible columns. I've got a partial workaround using this code:
[code]
var closePrintView = function(e) {
if(e.which == 27) {
printViewClosed();
}
};

function printViewClosed() {
datatable.fnSetColumnVis(5, true);
$(window).unbind('keyup', closePrintView);
}

var datatable = $('#datatable').dataTable({
"sScrollY": "350px",
"bPaginate": false,
"sDom": 'lfrtip<"clear spacer">T',
"oTableTools": {
"sSwfPath": "/flash/copy_cvs_xls_pdf.swf",
"aButtons": [
{
"sExtends": "copy",
"mColumns": [0, 1, 2, 3, 4]
},
{
"sExtends": "csv",
"mColumns": [0, 1, 2, 3, 4]
},
{
"sExtends": "pdf",
"mColumns": [0, 1, 2, 3, 4]
},
{
"sExtends": "print",
"mColumns": [0, 1, 2, 3, 4],
"sMessage": 'Click print or cancel Print',
"fnClick": function (nButton, oConfig, oFlash) {
datatable.fnSetColumnVis(5, false);
$(window).keyup(closePrintView);
}
},
]
}
});
[/code]

Basically when the print button is clicked, I hide a column and attach a keyup event handler to the window object. The handler checks to see if the key pressed was the escape key, and if it was, it calls a function that will make the columns visible again and unbind the window object's keyup event handler.

The problem with this is that when I set the column visibility to false in the print button's fnClick callback, my headers disappear. Specifically, the height of the tr nodes in the thead node is set to 0px, and the content of the th nodes is blank. The headers do, however, return when making the column visible again (in printViewClosed()) . So basically my print view has no table headers.

I tried hiding the column on the normal view to check whether my headers were lost, but everything worked as expected. So I'm only losing the headers on the print view.

I supposed I could try re-add the headers in my fnClick callback, but I figured I'd ask here first to see if there is a better way of going about all of this...

edtd

Made a mistake in my last post. When I said:
the height of the tr nodes in the thead node is set to 0px, and the content of the th nodes is blank

I was looking at the wrong headers. DataTable seems to use a separate table for the headers, and I was looking at the thead of the wrong table. The actual problem is that the div containing the headers table is being hidden. I fixed this by changing my fnClick callback to:
[code]
function (nButton, oConfig, oFlash) {
datatable.fnSetColumnVis(5, false);
$('div.dataTables_scrollHead').show();
$(window).keyup(closePrintView);
}
[/code]

So I've got it working, but it does seem a bit unintuitive. That said, I really love DataTables and want to thank you for all the work you put into such a great utility.

allan

This, I'm afraid, is correct behaviour at the moment. The print view doesn't have an 'mColumns' property - so it will just ignore it if you give it one. What you have done with fnSetColumnVis is right on for the current implementation (and what I would do with TableTools internally if mColumns was supported). I think it probably should be supported and I will add it in in future - but for the moment this is the correct approach :-)

Regards,
Allan

fusionzone

only problem with above is when you "esc' back to the table the column that was hidden is still hidden on the original table...any fix?

fusionzone

here is the fix to get the hidden column back when pressing escape; not sure if you still need the 'closePrintView' but doesn't seem to affect my project.

[code]
"fnClick": function (nButton, oConfig, oFlash) {
oTable.fnSetColumnVis(5, false);
$('div.dataTables_scrollHead').show();
$(window).keyup(function(){
oTable.fnSetColumnVis(5, true);
});
}
[/code]