Checkbox sort in DataTables using jQuery

what i did is creatinga bool var in hidden P so it will be in the sameplace as the checkbox.than i disabled the option of change value in checkbox and the sorting is now working.


Found this example:

$.fn.dataTableExt.afnSortData['dom-checkbox'] = function  ( oSettings, iColumn )
{
    var aData = [];
    $( 'td:eq('+iColumn+') input', oSettings.oApi._fnGetTrNodes(oSettings) ).each( function () {
        aData.push( this.checked==true ? "1" : "0" );
    } );
    return aData;
}

Initialized like so:

$(document).ready(function() {
    $('#example').dataTable( {
        "aoColumns": [
            null,
            null,
            null,
            null,
            null,
            { "sSortDataType": "dom-checkbox" }
        ]
    } );
} );

Here: http://www.datatables.net/examples/plug-ins/dom_sort.html


I had to slightly tweak the answer provided by Moby's Stunt Double. No additional sorting plug-in required! Just a little custom coding.

Thanks for all the ideas, everyone! For some reason I had to do special handling for my table that was not a general solution. Which was fine by me.

My checkbox was disabled and checked programatically, so I couldn't call .checked. The call based on iColumn also threw things off; probably because I had a hidden 0th column.

This is what worked for me:

$.fn.dataTableExt.afnSortData['dom-checkbox'] = function  ( oSettings, iColumn ) {
    var aData = [];
    $(oSettings.oApi._fnGetTrNodes(oSettings)).each( function () {
        var checker = $(this).find('.classOnSurroundingSpan input');
        aData.push( checker.prop("checked")==true ? "1" : "0" );
    } );
    return aData;
}

My mark-up looked like this (the surrounding span was part of a solution to enable tracking a click on a disabled checkbox):

<span class='classOnSurroundingSpan'><input type='checkbox' disabled='disabled'/></span>

My table definition was (in part):

"aoColumnDefs": [
    {"sSortDataType": "dom-checkbox",
    "aTargets":[1],
    "asSorting": ["desc"]}
]

This solution worked for me so I wrote up a blog post on it.

http://blog.josephmisiti.com/sorting-booleans-in-jquery-datatables