Datatables: Turning rowGrouping on/off dynamically?!

MAKU

Hello together.

I need a function where i can hide and show rowgrouping when different columns are selected.
Would be grateful for any tip.

Thanks Marika

// grouping start

        "drawCallback": function ( settings ) {
        var api = this.api();
        var rows = api.rows( {page:'current'} ).nodes();
        var last=null;
        var colonne = api.row(0).data().length;
        var totale = new Array();
        totale['Totale']= new Array();
        var groupid = -1;
        var subtotale = new Array();


        api.column(6, {page:'current'} ).data().each( function ( group, i ) {    
            var aData = parseMonth(group); 
            if ( last !== aData ) {
                groupid++;
                $(rows).eq( i ).before(
                    '<tr class="group"><td colspan="12">'+aData+'</td></tr>'
                );
                last = aData;
            }


            val = api.row(api.row($(rows).eq( i )).index()).data();      //current order index
            $.each(val,function(index2,val2){
                    if (typeof subtotale[groupid] =='undefined'){
                        subtotale[groupid] = new Array();
                    }
                    if (typeof subtotale[groupid][index2] =='undefined'){
                        subtotale[groupid][index2] = 0;
                    }
                    if (typeof subtotale[groupid][index2] =='NaN'){
                        subtotale[groupid][index2] = 0;
                    }

                    if (typeof totale['Totale'][index2] =='undefined'){ totale['Totale'][index2] = 0; }

                    valore = parseInt(val2);

                    subtotale[groupid][index2] += valore;

                    totale['Totale'][index2] += valore;
            });



        } );                
    $('tbody').find('.group').each(function (i,v) {
                var rowCount = $(this).nextUntil('.group').length;
            $(this).find('td:first').append($('<span />', { 'class': 'rowCount-grid' }).append($('<b />', { 'text': '' })));
                     var subtd = '';
                    for (var a=12;a<22;a++)
                    {     

                        subtd += '<td>' + removeDecimalPoints(subtotale[i][a]) + '</td>';

                    }

                    var subtd2 = '';
                    for (var a=22;a<28;a++)
                    {                             
                        subtd2 = '<td colspan="7">' + '</td>';
                    }

                    $(this).append(subtd);
                    $(this).append(subtd2);
            });

    }, 

// grouping end
//sort start

    $('#example tbody').on( 'click', 'tr.group', function () {
        var currentOrder = table.order()[0];
        if ( currentOrder[0] === 6 && currentOrder[1] === 'asc' ) {
            table.order( [ 6, 'desc' ] ).draw();
        } else {
            table.order( [ 6, 'asc' ] ).draw();
        }

    } );

//sort end

ignignokt

By different columns being selected, do you mean sorted? If not, what exactly do you mean by a column selected?

MAKU

yes. i wand in my function, "rowGrouping" load dinamically,
when i sorted with a column[6].

ignignokt

In your drawCallback you can put your row grouping code in an if statement. So if you only want row grouping when you sort column #6 (which is the 7th column since it counts 0 as the first) you'd do this:

if(settings.aLastSort[0].col === 6){
    //row grouping code here and anything else you want
}

MAKU

Thank you very much!

In my code, he had listed the rowGroupping twice. Only after the click, the error was gone.

  $('#example thead').one( 'click', function () {
                    var currentOrder = table.order()[0];
                    if (currentOrder[0] === 6) {                        
                    rowGrouping(api, settings);
                    } 

                } );    

however, everything perfect, thanks...