Hidden Row and the plus/minus button

Hidden Row and the plus/minus button

jdac74jdac74 Posts: 2Questions: 0Answers: 0
edited July 2013 in DataTables 1.9
Hi all,

I'm using the very useful code to show/hide table rows and have run into a little problem I can't figure out.

The default behavior is to show the Plus image on table load, and to show a Minus image after a row is expanded. So far so good. What I want though is to have either a third image, or no image at all, if there is no actual data to show in the expanded row.

Here's what I have so far:

[code]
function fnFormatDetails ( oTable, nTr )
{
var aData = oTable.fnGetData( nTr );
if (aData[9] != '') {
var sOut = '';
sOut += ' Candidates Applied:'+aData[9]+'';
sOut += '';
}
return sOut;
}

jQuery(document).ready(function(){
loadPage();

jQuery("#cboOffice").change( function( e ) {
getValues('Branch2User','cboRecruiters','cboOffice','AllID','','');
} );

var nCloneTh = document.createElement( 'th' );
var nCloneTd = document.createElement( 'td' );
nCloneTd.innerHTML = '';
nCloneTd.className = "center";

jQuery('#reportData thead tr').each( function () {
this.insertBefore( nCloneTh, this.childNodes[0] );
} );

jQuery('#reportData tbody tr').each( function () {
this.insertBefore( nCloneTd.cloneNode( true ), this.childNodes[0] );
} );

var oTable = jQuery("#reportData").dataTable({
"aoColumnDefs": [
{ "bSortable": false, "aTargets": [ 0 ] }
],
"aaSorting": [[1, 'asc']],
"iDisplayLength": -1,
"aLengthMenu": [[25, 50, 100, -1], [25, 50, 100, "All"]],
"aoColumns": [
/* Expand Row */ null,
/* Office */ null,
/* Recruiter */ null,
/* Company */ null,
/* Job ID */ null,
/* Job Title */ null,
/* Date */ null,
/* Status */ null,
/* Num Applys */ null,
/* Candidates */ {"bVisible":false}
]
});

jQuery('#reportData tbody td img').live('click', function () {
var nTr = $(this).parents('tr')[0];
if ( oTable.fnIsOpen(nTr) )
{
/* This row is already open - close it */
this.src = "images/details_open.png";
oTable.fnClose( nTr );
}
else
{
/* Open this row */
this.src = "images/details_close.png";
oTable.fnOpen( nTr, fnFormatDetails(oTable, nTr), 'details' );
}
} );

});
[/code]

+aData[9] is the hidden column that holds the data that's to go in the hidden row when expanded.

I'm sure I've been as clear as mud, but any help is greatly appreciated.

Replies

  • jdac74jdac74 Posts: 2Questions: 0Answers: 0
    Feel free to delete, I'm using a pop-up instead to display the data.
This discussion has been closed.