**PLEASE HELP** hidden row example is not drawing rows

**PLEASE HELP** hidden row example is not drawing rows

DenonthDenonth Posts: 76Questions: 0Answers: 0
edited August 2012 in General
Hi all,

I want to use a hidden row details example. But I can't make it work. I am using "Extend" button on the same table as well. I have tried without it too but still I haven't got it to work.

In TH everything is done correctly but in the TR there is no empty space with the icons.

I am sending you debug code so you can see what might went wrong in my code.

Debug link: http://debug.datatables.net/uvifax

Replies

  • DenonthDenonth Posts: 76Questions: 0Answers: 0
    edited August 2012
    guys any idea what might went wrong?

    This code is not working for me.
    [code]
    $('#jphit tbody tr').each( function ()
    {
    this.insertBefore( nCloneTd.cloneNode( true ), this.childNodes[0] );
    } );
    [/code]
  • DenonthDenonth Posts: 76Questions: 0Answers: 0
    This is my whole example:

    [code]
    /* Formating function for row details */
    function fnFormatDetails ( oTable, nTr )
    {
    var aData = oTable.fnGetData( nTr );
    var sOut = '';
    sOut += 'Rendering engine:'+aData[1]+' '+aData[4]+'';
    sOut += 'Link to source:Could provide a link here';
    sOut += 'Extra info:And any further details here (images etc)';
    sOut += '';

    return sOut;
    }

    $(document).ready(function() {

    /*
    * Insert a 'details' column to the table
    */
    var nCloneTh = document.createElement( 'th' );
    var nCloneTd = document.createElement( 'td' );
    nCloneTd.innerHTML = '';
    nCloneTd.className = "center";

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

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

    var oTable=$('#jphit').dataTable( {
    "sDom": 'T,C<"clear">lfrtip',
    "oTableTools": {
    "sSwfPath": "swf/copy_csv_xls_pdf.swf"
    },
    "oColVis": {
    "buttonText": "Extend table",
    "activate": "mouseover"
    },
    "aoColumnDefs": [
    { //"bVisible": false, "aTargets": [ 0 ],
    "bSortable": false, "aTargets": [ 0 ] }
    ],
    "aaSorting": [[1,'asc']],
    "bProcessing": true,
    "bServerSide": true,
    "sPaginationType": "full_numbers",
    "sScrollY": "350px",
    "bDeferRender": true,
    "sAjaxSource": "increment_table.php"
    } );



    /* Add event listener for opening and closing details
    * Note that the indicator for showing which row is open is not controlled by DataTables,
    * rather it is done here
    */
    $('#jphit 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]
  • DenonthDenonth Posts: 76Questions: 0Answers: 0
    edited August 2012
    can someone check this link : http://stackoverflow.com/questions/11863053/datatables-plugin-is-not-working-when-hiding-a-details#comment15781878_11863053

    I have put pictures and so on..

    Alan I was hoping of getting your attention because I am sure that this is a simple problem to be solved.
  • DenonthDenonth Posts: 76Questions: 0Answers: 0
    can someone please give me some kind of idea of what to do to make it work
This discussion has been closed.