Datatables row group pagination per group

bobin56

i have a simple datatable row group example ,in this example each row group has 10 records ,and there are 4 row groups , question is how do i paginate them in a way that each page displays 5 records from each row group instead of displaying 10 records from 2 row groups , here is my fiddle https://jsfiddle.net/bobin56/tLnvxj87/

Javascript Code:

...

  var table = $('#example').DataTable({

    "columnDefs": [

        { "visible": false, "targets": 2 }
    ],

    "order": [[ 2, 'asc' ]],

    "displayLength": 20,

    "drawCallback": function ( settings ) {

        var api = this.api();

        var rows = api.rows( {page:'current'} ).nodes();

        var last=null;

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

                last = group;
            }
        } );
    }
} );

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

Another quick question , how do i arrange so as the order should be goalkeepers, defenders, midfielders and forwars....will appreciate any help :-)

Ashbjorn

Hi bobin56,

You'd have to limit that on your datasource to 5 for each group if you want DataTables to render it like that.

Your example and question do not seem to match (4 groups of 10 rows), though I understand what you are asking.

If you want to alter the sort order then add an extra data property to your datasource that indicates the sort order as a number for instance and then use the text to display it.

Small pseudo example:

[ { "id": 1, "name": "Joe", "category": { "sequence":  1, "name": "Goalkeeper" ], .... }, { ... } ]

Then I presume you could tell DataTable to do the sorting on category.sequence but you display the category.name on the row; something in that direction.

Most likely there is a better way to accomplish this but it's 2AM and my brain is fried =]

Hope this helps,