Getting Javascript error when viewing details for a row

tad.lamb

I've got a table with a fixed header and fixed columns on the left side. When the user clicks on a cell, the row below will open up to reveal a div that has details for the cell. For the most part it is working, but the first time I click a cell I get the following error:

Cannot read property 'anCells' of undefined

Here is the section of code from the FixedColumns plugin where the error is occurring:

            /* Add in the tbody elements, cloning form the master table */
            $('>tbody>tr', that.dom.body).each( function (z) {
                var n = this.cloneNode(false);
                n.removeAttribute('id');
                var i = that.s.dt.oFeatures.bServerSide===false ?
                    that.s.dt.aiDisplay[ that.s.dt._iDisplayStart+z ] : z;
                for ( iIndex=0 ; iIndex<aiColumns.length ; iIndex++ )
                {
                    var aTds = that.s.dt.aoData[i].anCells || that.s.dt.oApi._fnGetTdNodes( that.s.dt, i );  // <-- error occurs on this line
                    iColumn = aiColumns[iIndex];

                    if ( aTds.length > 0 )
                    {
                        nClone = $( aTds[iColumn] ).clone(true, true)[0];
                        n.appendChild( nClone );
                    }
                }
                nBody.appendChild( n );
            } );

It seems like it is looping through the rows as it is working to clone the fixed columns, and the error is occurring for the last column that it is cloning. (I tried to create a live.datatable but was not successful)

Here is the code I am using to create the fixed columns:

            ClassroomGradesheet.fixedColumns = new $.fn.DataTable.FixedColumns(ClassroomGradesheet.oTable, {
              "sScrollX": "100%",
              "iLeftColumns": 4,
              "iLeftWidth": 180,
              "heightMatch": "auto"
            });

And here is the code that I execute when a table cell is clicked:

ClassroomGradesheet.fixedColumns.fnRedrawLayout();

I can see what the code is doing syntactically, but I am not sure what conditions occur to make i one greater than the number of items in the array.

allan

Are you able to link to a test page showing the issue please? I see you said you tried to use live.datatables.net, but even the non-working could would be useful (although a working page showing the issue would be better of course!).

When you say you are showing details below the row - FixedColumns isn't compatible with the child rows functionality of DataTables. That is a known issue. But I'm not sure if you are using that, or something else form the above.

Allan