After Print, Column Header not clickable in scrolling Table

After Print, Column Header not clickable in scrolling Table

jliebermannjliebermann Posts: 7Questions: 0Answers: 0
edited March 2013 in TableTools
Hello, with TT 2.1.2 and tested with 2.1.5, the columns can not be sorted after PRINT preview if table is scrolling (in the example, just add "sScrollX":"100%" in table initialisation). but within print preview, sorting does work. i have some modifications in my tables (selects to filter in the footer, using colreorder etc), in my code the header/footer disappears when clicking in print preview, and after the preview my filter selects and sorting do not work.
i'm not an experienced programmer but found a workaround for me, i wonder if anyone can do a better job and fix this...
btw, this disables all click events in the preview, so the table is not sortable in print preview (for me its not a problem, thats what i want in fact)

i modified _fnPrintScrollStart and _fnPrintScrollEnd, the code is from 2.1.2. see below. any comments and enhancements are welcome !

// add scrollheaders array after array for hidden nodes
[code]
TableTools = function( oDT, oOpts )
{
...
this.dom = {
..
"hidden": [],
"scrollheaders": [],
..
[/code]
// and change the _fnPrintScrollStart and _fnPrintScrollEnd functions
// changes are marked with //MODIFY for next line or //MODIFY //EOF for blocks

[code]
/**
* Take account of scrolling in DataTables by showing the full table
* @returns void
* @private
*/
"_fnPrintScrollStart": function ()
{
var
oSetDT = this.s.dt,
nScrollHeadInner = oSetDT.nScrollHead.getElementsByTagName('div')[0],
nScrollHeadTable = nScrollHeadInner.getElementsByTagName('table')[0],
nScrollBody = oSetDT.nTable.parentNode;

/* Copy the header in the thead in the body table, this way we show one single table when
* in print view. Note that this section of code is more or less verbatim from DT 1.7.0
*/
var nTheadSize = oSetDT.nTable.getElementsByTagName('thead');
//MODIFY
var anHeaders = this.dom.print.scrollheaders;
if ( nTheadSize.length > 0 )
{
//MODIFY save header
anHeaders.push( {
"node": nTheadSize[0]
} );
// EOF
oSetDT.nTable.removeChild( nTheadSize[0] );
}

if ( oSetDT.nTFoot !== null )
{
var nTfootSize = oSetDT.nTable.getElementsByTagName('tfoot');
if ( nTfootSize.length > 0 )
{
//MODIFY save header
anHeaders.push( {
"node": nTfootSize[0]
} );
//EOF
oSetDT.nTable.removeChild( nTfootSize[0] );
}
}
//MODIFY: dont clone
//nTheadSize = oSetDT.nTHead.cloneNode(true);
//oSetDT.nTable.insertBefore( nTheadSize, oSetDT.nTable.childNodes[0] );
//MODIFY: generate new header from table and append
$('').html($(oSetDT.nTHead).html()).appendTo($(oSetDT.nTable));

if ( oSetDT.nTFoot !== null )
{
//MODIF>: dont clone
//nTfootSize = oSetDT.nTFoot.cloneNode(true);
//oSetDT.nTable.insertBefore( nTfootSize, oSetDT.nTable.childNodes[1] );
//MODIFY: generate new footer from table and append (create it from header
//if footer conatains filters)
$('').html($(oSetDT.nTHead).html()).appendTo($(oSetDT.nTable));
}

/* Now adjust the table's viewport so we can actually see it */
if ( oSetDT.oScroll.sX !== "" )
{
oSetDT.nTable.style.width = $(oSetDT.nTable).outerWidth()+"px";
nScrollBody.style.width = $(oSetDT.nTable).outerWidth()+"px";
nScrollBody.style.overflow = "visible";
}

if ( oSetDT.oScroll.sY !== "" )
{
nScrollBody.style.height = $(oSetDT.nTable).outerHeight()+"px";
nScrollBody.style.overflow = "visible";
}
},


/**
* Take account of scrolling in DataTables by showing the full table. Note that the redraw of
* the DataTable that we do will actually deal with the majority of the hardword here
* @returns void
* @private
*/
"_fnPrintScrollEnd": function ()
{
var
oSetDT = this.s.dt,
nScrollBody = oSetDT.nTable.parentNode;

if ( oSetDT.oScroll.sX !== "" )
{
nScrollBody.style.width = oSetDT.oApi._fnStringToCss( oSetDT.oScroll.sX );
nScrollBody.style.overflow = "auto";
}

if ( oSetDT.oScroll.sY !== "" )
{
nScrollBody.style.height = oSetDT.oApi._fnStringToCss( oSetDT.oScroll.sY );
nScrollBody.style.overflow = "auto";
}
//MODIFY restore scroll headers
var nTheadSize = oSetDT.nTable.getElementsByTagName('thead');
if ( nTheadSize.length > 0 )
{
oSetDT.nTable.removeChild( nTheadSize[0] );
oSetDT.nTable.appendChild( this.dom.print.scrollheaders[0].node );
}
var nTfootSize = oSetDT.nTable.getElementsByTagName('tfoot');
if ( nTfootSize.length > 0 )
{
oSetDT.nTable.removeChild( nTfootSize[0] );
oSetDT.nTable.appendChild( this.dom.print.scrollheaders[1].node );
}
this.dom.print.scrollheaders.splice( 0, this.dom.print.scrollheaders.length );
//EOF
},
[/code]
This discussion has been closed.