FixedColumns & Sorting...
FixedColumns & Sorting...
nobinyeluaku
Posts: 2Questions: 0Answers: 0
I noticed something weird today on our implementation of datatables and fixedcolumns. On initial load, the sieze of the grid leaves approximately 30px from the bottom of screen. However, as soon as one of the non fixed colums are sorted, additional space is added at the bottom of the grid. I tracked the problem down to the _fnGridHeight function. It appears that when the table is initially drawn, there is a re-calculation of the grid height which removes extra space from the bottom of the screen. But as soon as one of the columns is sorted, the grid reverts to the original height (without any removal of space) and therefore adds the extra space. Anyway I found that if I kept the original grid height and passed it to the _fnGridHeight function, it solved my problem. I also noticed that one of the calls to the _fnGridHeight has "that" object as a variable, but never used in the actual function. I'm curious to know if I've fixed a legitimate bug or if I've simply messed with the code to fix my own quirkiness. Here are my changes to the FixedColumns.js file:
[code]
var bFirstDraw = true;
+ var height = $(this.dom.grid.dt).height();
+
this.s.dt.aoDrawCallback = [ {
"fn": function () {
that._fnDraw.call( that, bFirstDraw );
- that._fnGridHeight( that );
+ that._fnGridHeight(height);
bFirstDraw = false;
},
"sName": "FixedColumns"
@@ -458,7 +460,7 @@
* another redraw of the main table. It doesn't need to be a full redraw however.
*/
this._fnGridLayout();
- this._fnGridHeight();
+ this._fnGridHeight(height);
this.s.dt.oInstance.fnDraw(false);
},
@@ -580,10 +582,10 @@
* @returns {void}
* @private
*/
- "_fnGridHeight": function ()
+ "_fnGridHeight": function (height)
{
var oGrid = this.dom.grid;
- var iHeight = $(this.dom.grid.dt).height();
+ var iHeight = height;
oGrid.wrapper.style.height = iHeight+"px";
oGrid.left.body.style.height = $(this.dom.scroller).height()+"px";
[/code]
[code]
var bFirstDraw = true;
+ var height = $(this.dom.grid.dt).height();
+
this.s.dt.aoDrawCallback = [ {
"fn": function () {
that._fnDraw.call( that, bFirstDraw );
- that._fnGridHeight( that );
+ that._fnGridHeight(height);
bFirstDraw = false;
},
"sName": "FixedColumns"
@@ -458,7 +460,7 @@
* another redraw of the main table. It doesn't need to be a full redraw however.
*/
this._fnGridLayout();
- this._fnGridHeight();
+ this._fnGridHeight(height);
this.s.dt.oInstance.fnDraw(false);
},
@@ -580,10 +582,10 @@
* @returns {void}
* @private
*/
- "_fnGridHeight": function ()
+ "_fnGridHeight": function (height)
{
var oGrid = this.dom.grid;
- var iHeight = $(this.dom.grid.dt).height();
+ var iHeight = height;
oGrid.wrapper.style.height = iHeight+"px";
oGrid.left.body.style.height = $(this.dom.scroller).height()+"px";
[/code]
This discussion has been closed.
Replies
Allan