DataTables hidden row details

Philip Harvey

I'm using DataTables with the DataTables hidden row details function to display a forum,this works well and has done so for a while until someone included an HTML table within the the content... when this was displayed the additional column with the open/shut icon was displayed on the table in the content area.

I can get around that by adding a css class to the users posted table but would rather add a CSS class to the default used by Datatables so I dont have to get my users to worry about it
[code]
/*
* Insert a 'details' column to the table
*/
var nCloneTh = document.createElement( 'th' );
var nCloneTd = document.createElement( 'td' );
nCloneTd.innerHTML = '';
nCloneTd.className = "center";
[/code]
I have been playing around with the 'var NCloneTD' line and the 'nCloneTd.className'line but cant work out the syntax.

Am I missing something obvious ?

Regards
Phil

Philip Harvey

Hi Alan,

I'd really appreciate your comments on this

Many thanks
Phil

Phil H

Hi Allan,

I would really appreciate your comments in this, I'm sure it is an easy fix but I'm struggling to find it using trial and error

Regards
Phil

allan

Hi Phil,

Sorry for the delay in getting back to you about this. So basically one of the cells has a table inside it, and the code you are using to insert the "details" show/hide button (which is presumably based on this: http://datatables.net/release-datatables/examples/api/row_details.html ) is inserting the extra column in the "inner" table as well?

I think all that you need to do in this case is to make the jQuery selector that is finding and inserting the cloned nodes a bit more selective. Currently my demo has:

[code]
$('#example tbody tr').each( function () {
this.insertBefore( nCloneTd.cloneNode( true ), this.childNodes[0] );
} );
[/code]

What I think you will need is:

[code]
$('#example>tbody>tr').each( function () {
this.insertBefore( nCloneTd.cloneNode( true ), this.childNodes[0] );
} );
[/code]

This just makes sure that only TR elements from the top table's tbody are modified.

Regards,
Allan