How do I sort a bool column?

ZZBrent

I am using ASP.NET MVC and grabbing columns from a SQL table. In C# these are bools but in SQL they are bits. The column in the Data Table is showing check boxes which are blanks for "False" (0) and checked for "True" (1).

However, the standard sort is not changing the order of these checkboxes. Is there a way to switch the order of these boolean values? I have searched everywhere I cannot seem to find another forum with this situation. Thank you for any help you can give on this.

rf1234

I think I have the same situation: My mysql database fields are Tinyint(1) which is used to save boolean values (0 and 1).

If I click to sort it works fine.

Something else must be wrong I guess.

Just post some code and someone can take a look (probably not me because I am using MySQL, Javascript and PHP...).

This is my entire Javascript code; maybe that helps a little

var ctrDeptSelectionEditor = new $.fn.dataTable.Editor({
    ajax: {
        url: 'actions.php?action=tblCtrDeptSelection'
    },
    table: "#tblCtrDeptSelection",
    fields: [ {
            name:      "govdeptSelected",
            type:      "checkbox",
            options:   [
                { label: '', value: 1 }
            ],
            separator: '',
            unselectedValue: 0
        }
    ]
});

var ctrDeptSelectionTable = $('#tblCtrDeptSelection').DataTable({
    dom: "Bfrltip",
    select: false,
    ajax: {
        url: 'actions.php?action=tblCtrDeptSelection'
    },
    columns: [
        {   data: "govdeptSelected",
            render: function ( data, type, row ) {
                if ( type === 'display' ) {
                    return '<input type="checkbox" class="editor-include">';
                }
                return data;
            }
        },
        {   data: "ctr_govdept.dept_name" },
        {   data: "userRole",
            render: function ( data, type, row ) {
                return renderRole(data);
            }
        },
        {   data: "ctr_installation", render: "[,<br>].instName"  },
        {   data: "gov", render: "[,<br>].govName"  },
        {   data: "gov", render: "[,<br>].govRegional12"  }
    ],
    order: [[1, 'asc'], [0, 'asc']],
    buttons: [
           "selectAllDepts",
           "selectNoDepts",
           "colvis" 
    ],
    rowCallback: function ( row, data, displayNum, displayIndex, dataIndex ) {
        // Set the checked state of the checkbox in the table
        $('input.editor-include', row).prop( 'checked', data.govdeptSelected >= 1 );
        if ( $('input.editor-include', row).is( ':checked' ) ) {
            $(row).addClass('fontThick');
        } else {
            $(row).removeClass('fontThick');
        }
    }    
});

$('#tblCtrDeptSelection').on( 'change', 'input.editor-include', function () {
    $.busyLoadFull("show", { 
        fontawesome: "fa fa-spinner fa-spin fa-3x fa-fw"
    });
    ctrDeptSelectionEditor
        .edit( $(this).closest('tr'), false )
        .set( 'govdeptSelected', $(this).prop( 'checked' ) ? 1 : 0 )
        .submit();
    ajaxReloadTbls( [ctrDeptSelectionTable] );
    ctrDeptSelectionTable.ajax.reload( function(){
        $.busyLoadFull("hide", { 
            // options here 
        })
    }, false);
} );

allan

Assuming you are using live dom elements (i.e. <input type="checkbox">) then you need to use a technique like that shown in this example.

Allan