Question

编辑jqgrid单元格时，我遇到了一个奇怪的问题。

我收到了一个“保存”按钮，用于从网格中获取更改的单元格值并将其发布到服务器以进行保存。
当我编辑单元格并将焦点移动到网格表上的任何其他位置，然后单击“保存”按钮时，单元格值将正确传递。
但如果我编辑单元格并直接单击保存按钮而不更改网格表内的焦点，则会丢失其更改的数据。
我正在使用$（“＃vehicleListTable”）。getChangedCells（'all'）;从网格中获取所有已编辑的行。

我尝试捕获事件“beforeSubmitCell，afterEditCell，beforeSaveCell，afterSaveCell，afterSaveCell”以查看当我完成编辑单元格并将焦点移动到“保存”按钮时是否调用它，并发现这些都没有被调用。当我更改单元格并将焦点移动到网格本身内时，它们会被调用。

任何人都可以帮助我吗？以下是我如何创建jggrid表的片段。

function initTable() {
            var vehTypesStr = "all:All;C:Car or Light Commercial;T:Heavy Commercial;M:Motorcycle;B:Boat;H:Caravan;R:Relocatable;A:Trailer";
            var stockTypesStr = "all:All;N:New;U:Used";
            var priceStatusTypesStr = "all:All;1:Over priced;-1:Under Priced;0:Neutral priced";
            jQuery("#vehicleListTable").jqGrid({                    
                url:'fetch-vehicle-list-json.action?q=2', 
                datatype: "json", 
                colNames:[                      
                    'Exception',
                    'Stock Number',
                    'Stock Type',
                    'Vehicle Type',
                    'Make',
                    'Model',
                    'Year',
                    'Drive Away Price',
                    'Price (unqualified)',
                    'Body Style',
                    'Exterior Base Colour',
                    'Odometer',
                    'Image Count',
                    'Price Status',
                    'Edited Online',
                    'Added Online'], 
                colModel:[  
                    {name:'exception',index:'exception',width:55,sortable:false,formatter:exceptionImagesFormatter,search:false},
                    {name:'stockNum',index:'stockNum',width:90},
                    {name:'vehicleNewUsedType',index:'vehicleNewUsedType',width:70,stype: 'select',searchoptions:{ sopt:['eq'], value: stockTypesStr}},
                    {name:'vehicleType',index:'vehicleType',width:120,stype: 'select',searchoptions:{ sopt:['eq'], value: vehTypesStr}},
                    {name:'make',index:'make',width:90},
                    {name:'model',index:'model',width:90},
                    {name:'year',index:'year',width:60,align:"right",search:false},
                    {name:'driveAwayPrice',index:'driveAwayPrice',width:90,align:'right',formatter:'currency',formatoptions:{thousandsSeparator:',',decimalPlaces:2,prefix:'$ ',defaulValue:''},search:false,editable:false,editrules:{number:true}},
                    {name:'egcPrice',index:'egcPrice',width:90,align:"right",formatter:'currency',formatoptions:{thousandsSeparator:",",decimalPlaces:2,prefix:"$ ",defaulValue:""},search:false},
                    {name:'bodyStyle',index:'bodyStyle',width:70},
                    {name:'exteriorColour',index:'exteriorColour',width:100,editable:false},
                    {name:'odometer',index:'odometer',width:70,search:false},
                    {name:'photoCount',index:'photoCount',width:80,align:"right",search:false},
                    {name:'priceStatus',index:'priceStatus',width:80,formatter:priceStatusImagesFormatter,stype: 'select',searchoptions:{ sopt:['eq'], value: priceStatusTypesStr }},
                    {name:'editedOnline',index:'lastModified',width:80,search:false,hidden:true},
                    {name:'addedOnline',index:'created',width:80,search:false,hidden:true}
                ],
                rowNum:20,
                scroll:1, 
                gridview: true,
                pager: '#vehicleListPager',
                sortname: "<s:property value="vehicleSearch.sortByField"/>",
                <s:if test="vehicleSearch.sortAscending">
                    sortorder:"asc",
                </s:if>
                <s:if test="!vehicleSearch.sortAscending">
                    sortorder:"desc",
                </s:if>
                viewrecords: true,
                recreateForm: true,
                recreateFilter: true,
                caption:"<s:property value="dealer.name"/>",
                multiselect: true,
                width: "40%",
                height: "250",                                      
                onSelectRow: handleTableOnSelect,                 
                beforeSelectRow: handleTableBeforeSelectRow,
                //afterInsertRow: handleTableAfterInsertRow,   
                onSelectAll: handleTableOnSelectAll,   
                loadComplete: handleTableLoadComplete,
                beforeSubmitCell: getEdittedCellData,
                afterEditCell  : getEdittedCellData,
                beforeSaveCell : getEdittedCellData,
                afterSaveCell  : getEdittedCellData,
                afterSaveCell  : getEdittedCellData       
            });
        }

由于苏哈

Answer 1

我遇到了同样的问题 - 单元格仍处于编辑模式，GetChangedCells方法无法获取值，因为它没有被保存＆＃34;由网格。为此，请按照下列步骤操作 -

声明两个变量来存储正在编辑的单元格的当前行和列。

var saverow;
var savecol;

使用afterEditCell单元格编辑事件将当前行和列存储到新变量中。这是在jqGrid初始化选项中完成的。

afterEditCell: function (id, name, val, IRow, ICol) {
     saverow = IRow;
     savecol = ICol;
}

在“保存”按钮的单击处理程序中，确定您是否有一个处于编辑模式的单元格，然后在jqGrid上调用saveCell方法。传递单元格的行和列值。这将存储该值还要调用jqGrid上的editCell方法，传入单元格的行和列值以及值false。这将使单元格退出编辑模式。将行和列值重置为空值。

// if a cell is currently in edit mode, then we need to save it and exit edit mode
if (saverow != null && savecol != null) {
    $("#vehicleListTable").jqGrid('saveCell', saverow, savecol, true);
    $("#vehicleListTable").jqGrid('editCell', saverow, savecol, false);
    saverow = null;
    savecol = null;
}

jqgrid编辑模式 - 在jqgrid内部未更改焦点时不设置数据

1 个答案: