jQuery Grid Plugin - jqGrid

jQuery version 1.4.4 on jqGrid version 3.4.4 (I believe the same issue exists even on the latest version of jqGrid looking at the forum).

Issue: as soon as you specify formatter: 'checkbox', the checkbox cell edit does not fire at all. Only the beforeEditCell and afterEditCell fire but saving dies not occur.

editable: true, edittype: 'checkbox', editoptions: { value: 'True:False' }, formatter: 'checkbox', formatoptions: { disabled: false}

I tried some suggestions in the forum on how to get this to work but the best one even loses the checkbox box in the list. I want to keep the functionality as standard as possible and only need a "fix" (in case this is a bug) to get cell edit with checkbox to fire of an ajax save. I do have "select" type columns that work just fine and fire as expected upon hitting enter key, but the checkboxes don't.

What does work:  As long as I don't specify the formatter: 'checkbox' it does work but the checkbox is not visible on loading the grid and is replaced with True or False when editing completed. Here is how the options look like that work, but without the checkbox displayed on listing the data:

editable: true, edittype: 'checkbox', editoptions: { value: 'True:False' },formatoptions: { disabled: false}

NOTE above, no formatter!

I can't beleive no one else has run into this, there mist be some option/suggestion on to keep the checkbox displayed always, pre-edit, when editing and after editing and saving has been completed. Any advice would be appreciated.

Just so you get the whole picture here is my template:

        $(item)
        .jqGrid({
            url: listURL,
            postData: '',
            datatype: "local",
            colNames: ['Id', 'Name', 'Commission<br />Rep', 'Business<br />Group', 'Order<br />Date', 'Edit', 'TBD', 'Month', 'Year', 'Week', 'Product', 'Product<br />Type', 'Online/<br />Magazine', 'Materials', 'Special<br />Placement', 'Logo', 'Image', 'Text', 'Contact<br />Info', 'Everthing<br />In', 'Category', 'Status'],
            colModel: [
                { name: 'Id', index: 'Id', hidden: true, hidedlg: true },
                { name: 'AccountName', index: 'AccountName', align: "left", resizable: true, search: true, width: 140 },
                { name: 'SalesRepFullName', index: 'SalesRepFullName', align: "left", search: true, width: 120 },
                { name: 'BusinessGroupName', index: 'BusinessGroupName', align: "left", search: true, width: 120 },
                { name: 'OrderDate', index: 'OrderDate', align: 'left', width: 85, search: true },
                { name: 'ContractUrl', index: '', align: 'center', sortable: false, width: 45 },
                { name: 'TBD', index: 'TBD', width: 35, sortable: true, align: "center", editable: true, edittype: 'checkbox', editoptions: { value: { 'False': 0, 'True': 1} }, formatter: 'checkbox' },
                { name: 'Month', index: 'Month', align: 'left', width: 75, sortable: true },
                { name: 'Year', index: 'Year', align: 'left', width: 45, sortable: true },
                { name: 'Week', index: 'Week', align: 'left', width: 45, sortable: true },
                { name: 'ProductName', index: 'ProductName', align: 'left', sortable: false, width: 120 },
                { name: 'ProductTypeName', index: 'ProductTypeName', align: 'left', sortable: false, width: 120 },
                { name: 'OnlineName', index: 'OnlineName', align: 'left', sortable: false },
                { name: 'Materials', index: 'Materials', width: 40, sortable: false, align: "center", editable: true, edittype: 'checkbox', editoptions: { value: 'True:False' }, formatter: 'checkbox', formatoptions: { disabled: false} },
                { name: 'SpecialPlacement', index: 'SpecialPlacement', width: 40, sortable: false, align: "center", editable: true, edittype: 'checkbox', editoptions: { value: 'True:False' }, formatter: 'checkbox', formatoptions: { disabled: false} },
                { name: 'Logo', index: 'Logo', width: 40, sortable: false, align: "center", editable: true, edittype: 'checkbox', editoptions: { value: 'True:False' }, formatter: 'checkbox', formatoptions: { disabled: false} },
                { name: 'Image', index: 'Image', width: 40, sortable: false, align: "center", editable: true, edittype: 'checkbox', editoptions: { value: 'True:False' }, formatter: 'checkbox', formatoptions: { disabled: false} },
                { name: 'Text', index: 'Text', width: 40, sortable: false, align: "center", editable: true, edittype: 'checkbox', editoptions: { value: 'True:False' }, formatter: 'checkbox', formatoptions: { disabled: false} },
                { name: 'ContactInfo', index: 'ContactInfo', width: 40, sortable: false, align: "center", editable: true, edittype: 'checkbox', editoptions: { value: 'True:False' }, formatter: 'checkbox', formatoptions: { disabled: false} },
                { name: 'EverythingIn', index: 'EverythingIn', width: 40, sortable: false, align: "center", editable: true, edittype: 'checkbox', editoptions: { value: 'True:False' }, formatter: 'checkbox', formatoptions: { disabled: false} },
                { name: 'ListingCategoryId', index: 'ListingCategoryId', width: 85, editable: true, hidden: false, edittype: "select", editoptions: { multiple: false, value: listingCategory }, editrules: { required: false }, formatoptions: { disabled: false} },
                { name: 'ListingStatusId', index: 'ListingStatusId', width: 85, editable: true, hidden: false, edittype: "select", editoptions: { multiple: false, value: listingStatus }, editrules: { required: false }, formatoptions: { disabled: false} }
            ],
            jsonReader: {
                root: "List",
                page: "CurrentPage",
                total: "TotalPages",
                records: "TotalRecords",
                userdata: "Errors",
                repeatitems: false,
                id: "0"
            },
            rowNum: $rows,
            rowList: [10, 20, 50, 200, 500, 1000, 2000],
            imgpath: jQueryImageRoot,
            pager: $(item + 'Pager'),
            recordtext: 'Traffic lines',
            sortname: 'OrderDate',
            viewrecords: true,
            sortorder: "asc",
            altRows: true,
            cellEdit: true,
            cellsubmit: "remote",
            cellurl: editURL + '?rows=' + $rows + '&page=1',
            loadComplete: function() {
                $(item + 'Pager td.nav-button[title="Select Columns"] .tbutton').click(function() { $(item).CRM_SetColumns(); });
            },
            gridComplete: function() {
                ToggleGridheight('#snh', item);
            },
            loadError: function(xhr, st, err) {
                if (!ignoreAlert) { alert(ajaxErrorMessage); }
            },
            afterEditCell: function(rowid, cellname, value, iRow, iCol) {
                //alert('afterEditCell: ' + value);
            },
            afterSaveCell: function(rowid, cellname, value, iRow, iCol) {
                //alert('afterSaveCell: ' + value);
            },
            afterSubmitCell: function(serverresponse, rowid, cellname, value, iRow, iCol) {
                //alert('afterSubmitCell: ' + value);
                return [true, ""];
            },
            beforeEditCell: function(rowid, cellname, value, iRow, iCol) {
                //alert('beforeEditCell: ' + value);                               
            },
            search: true,
            searchdata: {},
            caption: "List of all Traffic lines",
            editurl: editURL + '?rows=' + $rows + '&page=1',
            hiddengrid: hideGrid
        })
        .navGrid(item + 'Pager',
            { refresh: false, view: false, edit: false, add: false, del: false, search: false }, //options
            {} // search options
        )
        .navButtonAdd(item + 'Pager', { caption: "", title: "Select Columns", buttonimg: jQueryImageRoot + '/column_Select.gif', position: 'last', onClickButton: null });