Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Best way to render boolean data columns in jquery datatables.net

I am using the datatables.net data grid with jquery and bootstrap. I have a large chunk of JSON data with some boolean columns in it and would like to render a datatables column as a checked or unchecked checkbox (all with bootstrap styling of course). What is the easiest/fastest was to do this?

like image 526
Deano Avatar asked Dec 03 '14 15:12

Deano


2 Answers

I answered my own question :-) it's actually very simple:

var simple_checkbox = function ( data, type, full, meta ) {
    var is_checked = data == true ? "checked" : "";
    return '<input type="checkbox" class="checkbox" ' +
        is_checked + ' />';
}

var setup_datatable = function () {
    $('#data-table').DataTable({
        "columns": [
            { "data": "id", "className": "text-center"},
            { "data": "keywords"},
            { "data": "platform"},
            { "data": "is_active", "render": simple_checkbox},
            { "data": "is_terminated", "render": simple_checkbox}
        ],
        "ajax": "/data"
    }); // DataTable

}
like image 93
Deano Avatar answered Oct 25 '22 17:10

Deano


Adding the disabled class will remove the function on the page but keep the look.

var simple_checkbox = function (data, type, full, meta) {
             var is_checked = data == true ? "checked" : "";
             return '<input type="checkbox" **class="checkbox disabled"** ' +
                 is_checked + ' />';
         }
like image 36
eric phillips Avatar answered Oct 25 '22 16:10

eric phillips