jqgrid ：客戶端中的內聯復選框編輯

Question

我正在使用 jqgrid。 我想允許人們在內聯編輯中使用復選框。 不會有編輯等任何按鈕，只要他點擊了復選框，就應該被認為是在客戶端提交的。

有一個復選框，我想始終保持在編輯模式。 用戶完成更改后，他將單擊提交按鈕，完整的網格數據將發布到服務器。

我希望getGridParam方法應該給我更新的單元格值。 然而，它並沒有這樣做。

我覺得我的問題是onSelectRow方法。 某處我缺少保存當前行狀態的實現。 & 因此在getGridParam方法中。 我得到了原始值。

代碼 ：

var lastsel;

 jQuery("#AcOpenDataGrid").jqGrid({
                    url: '/Admin/Role/GetMappedMenus',
                    viewrecords: true, sortname: 'Code', sortorder: "desc",
                    colNames: [
                    "Code",
                    "MenuName",
                    "Allow"
                    ],
                    colModel: [
                     { name: 'Code', width: 10, key: true, align: 'center', hidden: true },
                     { name: 'MenuName', index: 'MenuName', width: 60, search: true, searchoptions: JQ_sopt_string, align: 'left' },
                     { name: 'Allow', index: 'Allow', width: 30, editable: true,edittype:'checkbox',editoptions: { value:"True:False" },formatter:'checkbox', formatoptions: {disabled : false}  ,search: true, searchoptions: JQ_sopt_string, align: 'center' },
                    ],
                    height: '500',
                    autowidth: true,
                    rowList: JQ_Paging_Opt,
                    rowNum: JQ_RowNum_Opt,
                    pager: pager_selector,
                    datatype: 'json', mtype: 'GET',
                    cmTemplate: { title: false },
                    loadonce:true,
                    altRows: true,
                    jsonReader: { root: "rows", page: "page", total: "total", records: "records", repeatitems: false, userdata: "userdata", id: "Code" },
                    editurl: 'clientArray',
                    onSelectRow: function (id) {
                        if (id && id !== lastsel) {
                            jQuery(grid_selector).jqGrid('restoreRow', lastsel);
                            //jQuery(grid_selector).jqGrid('saveRow', lastsel);
                            jQuery(grid_selector).jqGrid('editRow', id, true);
                            lastsel = id;
                        }
                    },

                }).navGrid(pager_selector, { view: false, del: false, add: false, edit: false, search: false, refresh: true }
                 ).jqGrid('filterToolbar', { stringResult: true, searchOnEnter: false, defaultSearch: 'cn' });
            });


  $(".submit").click(function () {
                var localGridData = $("#AcOpenDataGrid").jqGrid('getGridParam', 'data');
                //To Do : Post Ajax here. 
         });

Answer 1

我在這里找到了解決方案。 不完全符合我的預期，但確實符合我的目的。

使列成為復選框

 beforeSelectRow: function (rowid, e) {
        var $self = $(this),
            iCol = $.jgrid.getCellIndex($(e.target).closest("td")[0]),
            cm = $self.jqGrid("getGridParam", "colModel"),
            localData = $self.jqGrid("getLocalRow", rowid);
        if (cm[iCol].name === "closed") {
            localData.closed = $(e.target).is(":checked");
        }

        return true; // allow selection
    },