Quantcast
Channel: Recent Discussions — DataTables forums
Viewing all articles
Browse latest Browse all 82610

After Print, Column Header not clickable in scrolling Table

$
0
0
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
TableTools = function( oDT, oOpts )
{
...
this.dom = {
..
"hidden": [],
"scrollheaders": [],
..
// and change the _fnPrintScrollStart and _fnPrintScrollEnd functions
// changes are marked with //MODIFY for next line or //MODIFY //EOF for blocks

/**
	 * 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
		$('<thead></thead>').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)
		  $('<tfoot></tfoot>').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
	},
	

Viewing all articles
Browse latest Browse all 82610

Latest Images

Trending Articles



Latest Images

<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>