mardi 4 août 2015

Close an opened child row on click (datatables script)

I'm stuck to close child rows on this script (for datatables): I cannot close the opened row child by clicking on the same td.details-control (which open and should close the row child) but the opened row child is closed after that I click on another td.details-control (so after that I open another row child).

Here is my code:

var tr;
var row;

// Opening child row 
 $('#table tbody').on('click', 'td.details-control', function () {

        if (tr !== null && tr !== undefined && row !== null && tr !== undefined) {
            row.child.hide();
            tr.removeClass('shown');            
        }

        tr = $(this).closest('tr');
        row = table.row( tr );

        if ( row.child.isShown() ) {
            // This row is already open - close it
            row.child.hide();
            tr.removeClass('shown');
        }
        else {
            // Open this row
            row.child( format(row.data()) ).show();
            tr.addClass('shown');
        }

    } );

    // Table refresh

    var table = $('#table').DataTable();
    setInterval( function () {
        table.ajax.reload( function () {
            if ( row.child.isShown() ) {
                // This row is already open - close it
                row.child.hide();
                tr.removeClass('shown');
            }
            else {          
                if (tr.hasClass('shown')) {
                    // Open this row
                    row.child( format(row.data()) ).show();
                    tr.addClass('shown');                       
                }
            }
        } );
    }, 5000 );  

    $('table td .details-control').html('<button><i class="fa fa-plus"></i></button>');

The problem is here: (I shall work on the condition but tried 10 000 things, and still stuck)

 if (tr !== null && tr !== undefined && row !== null && tr !== undefined)        
 {
        row.child.hide();
        tr.removeClass('shown');            
    }

Because the row.child.hide(); I am stuck in the open this row condition

Aucun commentaire:

Enregistrer un commentaire