[Solved]FixedColumns and extra scrollbar

love1106

Hi all,
Following this discussion : http://www.datatables.net/forums/discussion/comment/42130 .
[quote]
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"... :)
[/quote]
I have a solution,but you must change FixedColumns plugin a little bit :
In "_fnGridSetup" function add :
[code]
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";
[/code]

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

[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";
[/code]

Hope this help you.