Datatable custom sort function on a given column

Question

I am using jquery datatables and I need to sort data by the first column which contains checkboxes by displaying checked boxes first

oTable =  $('#userTable', context).dataTable(
{
    "sAjaxSource":'/ajax/getdata/',
    "fnServerData": function ( sSource, aoData, fnCallback, oSettings ) 
    {
        oSettings.jqXHR = $.ajax( 
        {
            "dataType": 'json',
            "type": "POST",
            "url": sSource,
            "data": params,
            "success" :  function(data)
            {
                fnCallback(data);
                fnSortBySelected();
            } 
        });
    }
});

var fnSortBySelected = function()
{
    var oSettings = oTable.fnSettings();
    var i = 0; 

    $('td:first-child input[type=checkbox]',oTable).sort(function(a, b)
    {
        if(a.checked) 
            oTable.fnUpdate( oSettings.aoData[i]._aData, i, 0);
        else 
            oTable.fnUpdate( oSettings.aoData[i+1]._aData, i, 0);
        i++;       
    });
}

thanks for your time , this is what i tried so far :

 oTable =  $('#userTable', context).dataTable({
"sAjaxSource":'/ajax/getdata/',
"fnServerData": function ( sSource, aoData, fnCallback, oSettings ) {
oSettings.jqXHR = $.ajax( {
           "dataType": 'json',
           "type": "POST",
           "url": sSource,
           "data": params,
           "success" :  function(data){
               fnCallback(data);
               fnSortBySelected();
           } 
        } );
}

 });

var fnSortBySelected = function()
{
    var oSettings = oTable.fnSettings();
    var i = 0; 

    $('td:first-child input[type=checkbox]',oTable).sort(function(a, b){
        if(a.checked) 
             oTable.fnUpdate( oSettings.aoData[i]._aData, i, 0);
        else 
             oTable.fnUpdate( oSettings.aoData[i+1]._aData, i, 0);
         i++;       
    } );


}

What have you tried so far? Providing your current code is a nice gesture saying that your not just asking for help and would like to learn. — Nate-Wilkins
– Nate-Wilkins, Commented Oct 1, 2012 at 17:13
Hi Nate , thanks for your time , this is what i tried so far : — JayCee
– JayCee, Commented Oct 2, 2012 at 14:53

JayCee · Accepted Answer · 2012-10-02 19:06:29Z

2

I Made it using Snickers answer by creating a hidden column (first column index 0) on every selected checkbox , i set the corresponding hidden column to "selected" then I sort the table on that hidden column and first name column

to hide the first column use

oTable.fnSetColumnVis( 0, false );

for every clicked checkbox do this

$('input[tyope=checkbox]',oTable).each(function(){
  var aPos = oTable.fnGetPosition($(this).parents('tr:first').get(0));
  oTable.fnUpdate( 'selected',aPos, 0 );
  $(this).attr('checked', true);  
});

and then call

oTable.fnSort( [ [0,'desc'],[2,'asc']] );

Thank you guys for your help

answered Oct 2, 2012 at 19:06

JayCee

711 gold badge1 silver badge4 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Pablo Rovi · Accepted Answer · 2013-02-14 11:51:08Z

1

Just add the right aoColumnDefs for your column:

oTable =  $('#userTable', context).dataTable(
{
    "aoColumnDefs": [
        { "sSortDataType": "dom-checkbox", "aTargets": [ 0 ] }
    ],
    .....

See Datatables colums

answered Feb 14, 2013 at 11:51

Pablo Rovi

111 bronze badge

Comments

Erik Saunier · Accepted Answer · 2012-10-01 16:59:57Z

0

Maybe you can try this:

$(document).ready(function() {
  var oTable = $('#example').dataTable();

  // Sort immediately with columns 0 and 1
  oTable.fnSort( [ [0,'asc'], [1,'asc'] ] );
} );

answered Oct 1, 2012 at 16:59

Erik Saunier

10.9k1 gold badge23 silver badges15 bronze badges

1 Comment

JayCee Over a year ago

Hey Snickers , your fnSort is working but it's not sorting column with checkboxes , any Idea what i can do ?

Collectives™ on Stack Overflow

Datatable custom sort function on a given column

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related