I would like to render any columns which have bool values as checkboxes.  I've searched around and found several suggestions.  The suggestions I've tried don't work, so I figured I'd ask here before I wasted any more time.

I've tried setting the "renderCheckboxes: true", and setting the individual column dataType = "bool", and format = "checkbox", but the columns still display "true" or "false", not checkboxes.

Here's my javascript (rendered from an MVC helper):

$(function() {
    $('#TransactionDetails_Grid').igGrid({
        dataSource: '/TASCommissions/CommissionTransactions/_TransactionDetails_Grid',
        autoGenerateColumns: false,
        autoGenerateLayouts: false,
        responseDataKey: 'Records',
        generateCompactJSONResponse: false,
        columns: [{
            headerText: '<span style=\'text-align: left; display:block;\'>Journal ID<span>',
            key: 'Journal_id',
            width: '9%',
            hidden: false,
            formatter: null,
            template: '<span style=\'text-align: left; display:block;\'>${Journal_id}</span>'},
        {
            headerText: '<span style=\'text-align: left; display:block;\'>Apply To<span>',
            key: 'Fk_journal_id',
            width: '9%',
            hidden: false,
            formatter: null,
            template: '<span style=\'text-align: left; display:block;\'>${Fk_journal_id}</span>'},
        {
            headerText: '<span style=\'text-align: left; display:block;\'>Contract ID<span>',
            key: 'Fk_cont_id',
            width: '9%',
            hidden: false,
            formatter: null,
            template: '<span style=\'text-align: left; display:block;\'>${Fk_cont_id}</span>'},
        {
            headerText: '<span style=\'text-align: left; display:block;\'>Transaction Type<span>',
            key: 'Fk_com_trans_type',
            width: '16%',
            hidden: false,
            formatter: null,
            template: '<span style=\'text-align: left; display:block;\'>${Fk_com_trans_type}</span>'},
        {
            headerText: '<span style=\'text-align: center; display:block;\'>Date<span>',
            key: 'Journal_date',
            width: '13%',
            hidden: false,
            formatter: Orange.toDateString,
            template: '<span style=\'text-align: right; display:block;\'>${Journal_date}</span>'},
        {
            headerText: '<span style=\'text-align: center; display:block;\'>Amount<span>',
            key: 'Journal_amount',
            width: '9%',
            hidden: false,
            formatter: Orange.toCurrencyString2,
            template: '<span style=\'text-align: right; display:block;\'>${Journal_amount}</span>'},
        {
            headerText: '<span style=\'text-align: left; display:block;\'>Created By<span>',
            key: 'Journal_created_by',
            width: '9%',
            hidden: false,
            formatter: null,
            template: '<span style=\'text-align: left; display:block;\'>${Journal_created_by}</span>'},
        {
            headerText: '<span style=\'text-align: center; display:block;\'>Chargeback Flag<span>',
            key: 'Journal_chargeback_flag',
            width: '13%',
            hidden: false,
            dataType: 'bool',
            format: 'checkbox'},
        {
            headerText: '<span style=\'text-align: center; display:block;\'>Reserve<span>',
            key: 'Journal_reserve_flag',
            width: '7%',
            hidden: false,
            dataType: 'bool',
            format: 'checkbox'},
        {
            headerText: '<span style=\'text-align: left; display:block;\'>Status<span>',
            key: 'Journal_status',
            width: '9%',
            hidden: false,
            formatter: null,
            template: '<span style=\'text-align: left; display:block;\'>${Journal_status}</span>'},
        {
            headerText: '<span style=\'text-align: left; display:block;\'>Fk_cpmt_id<span>',
            key: 'Fk_cpmt_id',
            width: '0',
            hidden: true,
            formatter: null,
            template: '<span style=\'text-align: left; display:block;\'>${Fk_cpmt_id}</span>'}],
        features: [{
            sortUrlKey: 'sort',
            sortUrlKeyAscValue: 'asc',
            sortUrlKeyDescValue: 'desc',
            name: 'Sorting',
            mode: 'single'},
        {
            name: 'Selection',
            mode: 'row',
            multipleSelection: false},
        {
            filterExprUrlKey: 'filter',
            filterLogicUrlKey: 'filterLogic',
            name: 'Filtering'}],
        jQueryTemplating: false,
        autoAdjustHeight: true,
        width: '100%',
        renderCheckboxes: true,
        initialDataBindDepth: 0,
        localSchemaTransform: false
    });
});

I suspect that "autoGenerateLayouts = false" may be overriding my checkbox settings, but it seems to be set to false even if the property in my MVC helper is set to true, so I can't test it. Same with "autoGenerateColumns".  Perhaps there is yet another property which causes autoGenerateLayouts and autoGenerateColumns to be automagically set to false?  Just speculating, maybe it's something else all together.