Quantcast
Channel: DataTables 1.9 — DataTables forums
Viewing all articles
Browse latest Browse all 1816

[Solved]FixedColumns and extra scrollbar

$
0
0
Hi all,
Following this discussion : http://www.datatables.net/forums/discussion/comment/42130 .

I've just tried to implement the FixedColumns plugin and have come across a small issue. When I use the 2.0.3 (Stable) version, the filtering no longer works and I get the message "span.DataTables_sort_icon", aoCloneLayout[i][j].cell)[0] is undefined" that I've seen mentioned in other forum posts. The fix for this was suggested to download the nightly, which did fix that problem, but introduced a new one.

Now, the scrollbar works, but is the entire width of the table (including the fixed column). I can live with this, but DT now seems to calculate that column width incorrectly and an additional scrollbar appears inside the fixed column, which allows for a few pixels of scrolling - this of course only appears pages (I use pagination) that include the widest bits of data. It also doesn't seem to be a consistent problem across browsers, in that it seems to be worse (appears more often) in FF.

It is an internal site, so I can't provide a link, and it also contains sensitive information, so I'd like to avoid uploading it to the debugger as well if possible. I realise this makes troubleshooting difficult, I guess this post is just a bit of a hopeful "has anybody seen this before, or know something obvious I should be checking"... :)
I have a solution,but you must change FixedColumns plugin a little bit :
In "_fnGridSetup" function add :
		this.dom.grid.dt.style.width = ($(this.dom.grid.dt).width() - this.s.iLeftWidth - this.s.iRightWidth) + "px";
		this.dom.grid.dt.style.position = "absolute";
		this.dom.grid.dt.style.top = "0px";
	        this.dom.grid.dt.style.left = this.s.iLeftWidth+"px";

after "if ( this.s.dt.nTFoot )" block code.

	"_fnGridSetup": function ()
	{
....
		if ( this.s.dt.nTFoot )
		{
			this.dom.footer = this.s.dt.nTFoot.parentNode;
			if ( this.s.iLeftColumns > 0 )
			{
				this.dom.grid.left.foot = nLeft.childNodes[2];
			}
			if ( this.s.iRightColumns > 0 )
			{
				this.dom.grid.right.foot = nRight.childNodes[2];
			}
		}

		this.dom.grid.dt.style.width = ($(this.dom.grid.dt).width() - this.s.iLeftWidth - this.s.iRightWidth) + "px";
		this.dom.grid.dt.style.position = "absolute";
		this.dom.grid.dt.style.top = "0px";
	        this.dom.grid.dt.style.left = this.s.iLeftWidth+"px";

Hope this help you.

Viewing all articles
Browse latest Browse all 1816

Trending Articles