FixedColumns - 2.0.2 min.js bug?

citizenjkl

Hello:

I am developing an ASP.Net application that will use FixedColumns. During the development phase I used Firefox as my browser and it was working well.

When I tested with IE9, I started to get this error: Microsoft JScript runtime error: Unable to get value of the property 'aoColumns': object is null or undefined.

In VS2010 the offending section of code highlighted was:
this.s={dt:a.fnSettings(),iTableColumns:a.fnSettings().aoColumns.length,aiWidths:[],bOldIE:c.browser.msie&&("6.0"==c.browser.version||"7.0"==c.browser.version)}

I changed from FixedColumns.min.js to FixedColumns.js and my problem seems to have gone away.

Hope this is useful information.

John

allan

That sounds very odd. I've just tried it myself with FixedColumns min in IE9 and it seems to work okay. I'll dig around a bit more, but if you have a demo showing the problem, that would be very useful.

Allan

citizenjkl

Sorry to have pointed you in the wrong direction.

Upon further research, I believe error is happening because my result set/table is empty.

I thought maybe if I added:
"oLanguage": {"sEmptyTable": "No data available in table"}

I would be able to get past the error but it is still happening on empty tables.

Here is the Datatable code I am using:


$(document).ready(function () {
var oTable = $('#MainContent_ReportGrid').dataTable({
"sScrollY": "500px",
"sScrollX": "100%",
"sScrollXInner": "400%",
"bScrollCollapse": true,
"bPaginate": false,
"bAutoWidth": false,
"sDom": 'RC<"clear">lfrtip',
"oLanguage": {
"sEmptyTable": "No data available in table"

"aoColumnDefs": [
{ "bSortable": false, "aTargets": [1] }
],
"aaSorting": [[0, 'asc']]
});

new FixedColumns(oTable, {
"iLeftColumns": 1,
"iLeftWidth": 200
});
$(window).bind('resize', function () { oTable.fnAdjustColumnSizing(); });
});

Sometimes empty tables may be returned, do you have a suggested work-around?

Thanks!

John

allan

Hi John,

I've just tried it here: http://live.datatables.net/okakac/edit and it seems okay with an empty table. Are you using the latest version of FixedColumns?

Allan

citizenjkl

The source that pops open on the error says:

* File: FixedColumns.min.js
* Version: 2.0.2
* Author: Allan Jardine (www.sprymedia.co.uk)

I tried it again in Firefox and the page renders (with no table).

IE9 crashes with the message I mentioned before:
Microsoft JScript runtime error: Unable to get value of the property 'aoColumns': object is null or undefined.

I'm so new to this, I don't know how to debug.

I do have a Firebug console window in Firefox that has an entry in red that says:
a.fnSettings() is null

When I right click, copy error I got:

a.fnSettings() is null
http://localhost:57006/Scripts/FixedColumns.min.js
Line 29

Underneath the red entry was a green link that took me to the source:

(function(c,m){FixedColumns=function(a,d){!this instanceof FixedColumns?alert("FixedColumns warning: FixedColumns must be initialised with the 'new' keyword."):("undefined"==typeof d&&(d={}),this.s={dt:a.fnSettings(),iTableColumns:a.fnSettings().aoColumns.length,aiWidths:[],bOldIE:c.browser.msie&&("6.0"==c.browser.version||"7.0"==c.browser.version)},this.dom={scroller:null,header:null,body:null,footer:null,grid:{wrapper:null,dt:null,left:{wrapper:null,head:null,body:null,foot:null},right:{wrapper:null,

Is this any help?

John

citizenjkl

I tried changing the script from FixedColumns.min.js to FixColumns.js.

/**
* @summary FixedColumns
* @description Freeze columns in place on a scrolling DataTable
* @file FixedColumns.js
* @version 2.0.2
* @author Allan Jardine (www.sprymedia.co.uk)

Now the errors in the console shows:

oDT.fnSettings() is null
http://localhost:51574/Scripts/FixedColumns.js
Line 83
"iTableColumns": oDT.fnSettings().aoColumns.length,

allan

That error suggests that oTable was null, or not a valid table when the FixedColumns instance was created. Can you give me a link to a test case that shows this error please?

Allan

citizenjkl

Allan:

Thanks for all of the time you are spending on this.

I don't have a way to make my application public and I've been unsuccessful duplicating outside my environment.

Maybe we could do a GoToMeeting or something?

What I have been thinking about is the table.

In my ASP.Net application, there is no data for the gridview resulting in no table being rendered in the html.

I have two thoughts:

Change my code to force the rendering a table even when the row count is zero.
Bypass the script if there is no table to process.

I need to learn both methods because there are going to be situations where either method would be useful.

Thanks again!

John

nickg

Hi Allan,

I'm getting the same error with FixedColumns when changing out tables via ajax. My test case is http://jsfiddle.net/DRmMx/10/. I made sure to clear my cache, and this error (at least for me) doesn't seem to be dependant on whether the table is empty or not (http://jsfiddle.net/gcsqT/1/). This only seems to occur in IE (using IE7) in our app. Though it seems like everything functions fine after ignoring this error, I would like to see this addressed. This error exists in both the stable 2.0.2 build and the new 2.0.3.dev build. The error shown in IE is "A runtime Error has occured. Do you wish to Debug? Line: 566 Error: Invalid argument.". This error occurs several times when the new table is loaded in, but oddly enough, doesn't occur on the next ajax table swap. Upon debugging using Microsoft Script Editor 10.0, when using the Full JS version for more clarity, the function in question is:

[code]
"_fnGridLayout": function ()
{
var oGrid = this.dom.grid;
var iTotal = $(oGrid.wrapper).width();
var iLeft = 0, iRight = 0, iRemainder = 0;

if ( this.s.sLeftWidth == 'fixed' )
{
iLeft = this.s.iLeftWidth;
}
else
{
iLeft = ( this.s.iLeftWidth / 100 ) * iTotal;
}

if ( this.s.sRightWidth == 'fixed' )
{
iRight = this.s.iRightWidth;
}
else
{
iRight = ( this.s.iRightWidth / 100 ) * iTotal;
}

iRemainder = iTotal - iLeft - iRight;

oGrid.left.wrapper.style.width = iLeft+"px";
oGrid.dt.style.width = iRemainder+"px";
oGrid.dt.style.left = iLeft+"px";

if ( this.s.iRightColumns > 0 )
{
oGrid.right.wrapper.style.width = iRight+"px";
oGrid.right.wrapper.style.left = (iTotal-iRight)+"px";
}
},
[/code]

and the highlighted line in question is:

[code]oGrid.dt.style.width = iRemainder+"px";[/code]


I also get a second error from the test case, "A runtime Error has occured. Do you wish to Debug? Line: 70 Error: 'fnSettings().aoColumns' is null or not an object", which also appears in firefox in the firebug console as:

"oDT.fnSettings() is null
[Break On This Error] "iTableColumns": oDT.fnSettings().aoColumns.length,
FixedC...htly.js (line 83)"

When debugging the IE error it highlights this entire block:

[code]
this.s = {
/**
* DataTables settings objects
* @type object
* @default Obtained from DataTables instance
*/
"dt": oDT.fnSettings(),

/**
* Number of columns in the DataTable - stored for quick access
* @type int
* @default Obtained from DataTables instance
*/
"iTableColumns": oDT.fnSettings().aoColumns.length,

/**
* Original widths of the columns as rendered by DataTables
* @type array.
* @default []
*/
"aiWidths": [],

/**
* Flag to indicate if we are dealing with IE6/7 as these browsers need a little hack
* in the odd place
* @type boolean
* @default Automatically calculated
* @readonly
*/
"bOldIE": ($.browser.msie && ($.browser.version == "6.0" || $.browser.version == "7.0"))
};
[/code]

as well as another third error in IE (though I've been unable to reproduce this again): "A runtime Error has occured. Do you wish to Debug? Line: 134 Error: Access is denied."

when debugging this error I get the following highlighted line:

[code]var range = win.document.selection.createRange();[/code]

contained in the following block of code:

[code]
// Most functions are defined in two ways, one for the IE selection
// model, one for the W3C one.
if (select.ie_selection) {
function selectionNode(win, start) {
var range = win.document.selection.createRange();
range.collapse(start);

function nodeAfter(node) {
var found = null;
while (!found && node) {
found = node.nextSibling;
node = node.parentNode;
}
return nodeAtStartOf(found);
}
[/code]

Sorry for the long post, but I understand issues like this can be quite frustrating, and I wanted to give as much information as possible. Hopefully the test case I put together will help.

P.S. Surprisingly enough, I only got the first error and only in IE7 in our app. I only ran across the Firefox error and the second and third error in IE in the test case on jsFiddle (guess I should count myself lucky it isn't breaking this bad in our app). I honestly don't know what the difference is between our app and the jsFiddle test case, I pretty much copied the same js for creating the table and fixed column. The only difference I know of is that in our app it actually does the table swap via an ajax call, the simplified test case uses a cloned table instead, and the data used for the table is taken from the dataTables example page, instead of actual confidential data in our app.


Thanks,
Nick

nickg

Hi Allan,

After some more searching on this issue I've found a solution. Don't know how I missed it the first time around since it is another discussion here on the dataTables forums. Not sure if it is a proper solution or not, but if it is, can it be put into the FixedColumns 2.0.3.dev build when you get a chance?

http://datatables.net/forums/discussion/6833/script87-invalid-argument.-error-with-fixedcolumns-and-ie78/p1

I've tested this in our app in both IE7 and Firefox 10.0.1, and don't get any errors.

Thanks,
Nick