I'm using DataTables as a data grid manager on my app. Everything works fine but until I'm equipped a hidden row info plugin. I tried many ways to change things but the first column of toggle image never showed up. Here's my code:
**Javascript**
This is an arrays from a server-side script
HTML Code:
No matter I've tried. The first column never shown up. Please suggest.
**Javascript**
var oTable; /* Formating function for row details */ function fnFormatDetails(nTr){ var aData=oTable.fnGetData(nTr); var sOut='<table cellpadding="7" cellspacing="0" border="0" style="border:solid 1px red;padding-left:50px;">'; sOut+='<tr><td>Renderingengine:</td><td>'+aData[2]+''+aData[3]+'</td></tr>'; sOut+='<tr><td>Linktosource:</td><td>Couldprovidealinkhere</td></tr>'; sOut+='<tr><td>Extrainfo:</td><td>Andanyfurtherdetailshere(imagesetc)</td></tr>'; sOut+='</table>'; return sOut; } $(document).ready(function() { oTable=$('#labour_show').dataTable({ "fnDrawCallback": function(){//row highlighter $('table#labour_show td').bind('mouseenter', function () { $(this).parent().children().each(function(){$(this).addClass('datatablerowhighlight');}); }); $('table#labour_show td').bind('mouseleave', function () { $(this).parent().children().each(function(){$(this).removeClass('datatablerowhighlight');}); }); }, "bProcessing": true, "bServerSide": true, "sAjaxSource": "inc/_labour_show_ajax.php", "aoColumns":[null,null,null,{"fnRender": function(oObj){return "<a href='main.php?do=labour&action=edit&sid=" + oObj.aData[7] + "'>Edit</a>";} }],"aaSorting": [[1, 'asc']] }); $('#labour_show tbody td img').live('click',function(){ var nTr = this.parentNode.parentNode; if(this.src.match('details_close')){ /* This row is already open - close it */ this.src = "images/ico_expand.png"; oTable.fnClose( nTr ); }else{ /* Open this row */ this.src = "images/ico_collapse.png"; oTable.fnOpen( nTr, fnFormatDetails(nTr), 'details' ); } }); });**_labour_show_ajax.php**
This is an arrays from a server-side script
$aColumns = array('labr_uid', 'labr_fname', 'emplyr_comp','labr_sid');
HTML Code:
<table cellpadding="0" cellspacing="0" border="0" class="display" id="labour_show"> <thead> <tr> <th></th> <th>Passport</th> <th>Name</th> <th width="30%">Employer</th> <th>Edit</th> </tr> </thead> <tbody> <tr> <td colspan="5" class="dataTables_empty"><img src="images/loading.gif" /></td> </tr> </tbody>
No matter I've tried. The first column never shown up. Please suggest.