jqGrid InlineEdit＆＃34; ENTER＆＃34;键不会触发＆＃34; aftersavefunc＆＃34;事件？

时间：2014-08-18 13:16:57

标签： jquery jqgrid

虽然this question类似，但在我的情况下没有帮助。我在一个模态中打开了几个jqGrids，都启用了内联编辑，键：true ，并定义了一个非常简单的aftersavefunc函数。但是，当使用 ENTER 键而不是单击保存图标时，我没有看到aftersavefunc事件触发。一些网格相当大，使用 KEYBOARD 笔划对于节省时间和提高准确性至关重要。这是一个已知的问题，还是有办法愚弄 jqGrid认为点击了保存图标？

下面是我的jqGrid定义（BEFORE）。任何帮助将不胜感激。

function hiliteQty(i) {
    console.log('Highlighting received quantity on #' + i);
    $eRow = $('tr#' + i);
    var qtyord = $eRow.find('td.qtyOrd').text();
    var qtyrec = $eRow.find('td.qtyRec').text();
    if ((+qtyord === +qtyrec) && (qtyrec !== null) && (qtyrec !== 'undefined') && (qtyrec !== '')) {
        $eRow.find('td.qtyRec').removeClass('incomplete',100,'linear').addClass('complete',1000,'easeInElastic');
    } else {
        $eRow.find('td.qtyRec').removeClass('complete',100,'linear').addClass('incomplete',1000,'easeInElastic');
    };
}
$(function() {
    var ml_id = '<?=$ml_id;?>', ml_name = '<?=$objML_temp->showMLName();?>', suppno = '<?=$objML_temp->gSupp();?>', projnum = '<?=$objJob_temp->gProjectNumber();?>', job_id = '<?=$objML_temp->gJobID();?>', lastDate, lastSel;
    $('#special_dialog').dialog({
        width:'auto',
        height:'auto',
        resizable:true
    });
    $.extend($.jgrid.defaults,{
        inlineData:{
            ml_id:ml_id,
            project_number:projnum,
            job_id:job_id
        },
        rowNum:1000,
        rowList:[20,50,100,500,1000],
        viewrecords:true,
        sortorder:'asc',
        height:500,
        autowidth:true,
        deepempty:true,
        altRows: true,
        grouping: true,
        groupingView: {
            groupField: ["vendor"],
            groupColumnShow: [true],
            groupText: ["<b>VENDOR: {0}</b>"],
            groupDataSorted: true,
            groupSummary: [false]
        }
    });
    // setup Minor Materials grid
    var mmGrid = $('#orderMMGrid'),
        editingRowId,
        mmEditParam = {
            keys: true,
            oneditfunc: function(id) {
                $('#orderMMGrid_ilsave').removeClass('ui-state-disabled');
                $('#orderMMGrid_ilcancel').removeClass('ui-state-disabled');
                hiliteQty(id);
            },
            afterrestorefunc: function() {
                editingRowId = undefined;
            },
            aftersavefunc: function(id) {
                hiliteQty(id);
            }
        },
        mmAutoCompOpts = {
            source: function(request, response) {
                $.getJSON('/json/json.searchmultiMaterials.php',{term:request.term,type:'m'},function(data) {
                    response(data);
                });
            },
            minLength: 3,
            focus: function(e,ui) {
                $('input:text[name="description"]').val(ui.item.description);
                $('input:text[name="vendor"]').val(ui.item.vendor);
                $('input:text[name="mfgr_partno"]').val(ui.item.mfgr_partno);
            },
            select: function(e,ui) {
                $('input:text[name="description"]').val(ui.item.description);
                $('input:text[name="vendor"]').val(ui.item.vendor);
                $('input:text[name="mfgr_partno"]').val(ui.item.mfgr_partno);
                $('input:text[name="vendor_id"]').val(ui.item.vendor_id);
            }
        },
        mmAddParam = {
            rowID: 'new',
            position:'last'
        };
    mmGrid.jqGrid({
        url: '/json/json.getMinorMaterialsOrder.php?ml_id=' + ml_id,
        datatype:'json',
        emptyrecords: 'No Minor Materials on this order',
        colNames: ['ID','Type','Supp','VID','Vendor','PO#','MasTec Part#','Manufacturer Part#','Description','Ship Date','Qty Ord','Rcvd Date','Qty Rec','Receiving Clerk Notes','Material Manager Notes'],
        colModel: [
            {   name:'id',
                index:'id',
                hidden:true,
                key:false,
                search:false,
                viewable:false
            },
            {   name:'type',
                index:'type',
                width:35,
                sortable:false,
                editable:false,
                align:'center',
                editoptions:{defaultValue:'M'}
            },
            {   name:'supp',
                index:'supp',
                width:35,
                sortable:false,
                editable:false,
                align:'center',
                editoptions:{defaultValue:suppno}
            },
            {   name:'vendor_id',
                index:'o.vendor_id',
                width:0,
                hidden:true,
                search:false,
                align:'center',
                viewable:true,
                editable:true,
                edittype:'text',
                editoptions:{size:8,readonly:true}
            },
            {   name:'vendor',
                index:'o.vendor_id',
                width:90,
                sortable:true,
                sorttype:'text',
                align:'left',
                editable:true,
                classes:'ui-ellipsis',
                edittype:'text',
                editoptions:{size:20,readonly:true},
                editrules:{required:true}
            },
            {   name:'order_number',
                index:'order_number',
                width:55,
                sortable:true,
                editable:true,
                classes:'ui-ellipsis',
                align:'center'
            },
            {   name:'mastec_partno',
                index:'mastec_partno',
                width:120,
                sortable:false,
                editable:true,
                classes:'ui-ellipsis',
                edittype:'text',
                editoptions:{
                    size:22,
                    dataInit:function(e) {
                        $(e).autocomplete(mmAutoCompOpts);
                    }
                },
                editrules:{required:true}
            },
            {   name:'mfgr_partno',
                index:'mfgr_partno',
                width:120,
                sortable:false,
                editable:true,
                classes:'ui-ellipsis',
                alilgn:'left',
                edittype:'text',
                editoptions:{size:22,readonly:true},
                editrules:{required:false}
            },
            {   name:'description',
                index:'description',
                width:180,
                sortable:false,
                align:'left',
                editable:true,
                classes:'ui-ellipsis',
                edittype:'text',
                editoptions:{size:33,readonly:true},
                editrules:{required:true}
            },
            {   name:'ship_date',
                index:'o.ship_date',
                width:85,
                sortable:true,
                sorttype:'date',
                editable:true,
                align:'center',
                editrules:{required:true},
                editoptions:{   size:15,
                                dataInit: function(l) {
                                    $(l).datepicker({dateFormat:'yy-mm-dd'});
                                }
                            }
            },
            {   name:'qty_ordered',
                index:'qty_ordered',
                width:55,
                sortable:false,
                editable:true,
                align:'center',
                classes:'qtyOrd',
                editrules:{required:true},
                editoptions:{size:6}
            },
            {   name:'rcvd_date',
                index:'o.rcvd_date',
                width:85,
                sortable:true,
                sorttype:'date',
                editable:true,
                align:'center',
                editoptions:{   size:15,
                                dataInit:function(l) {
                                    $(l).datepicker({dateFormat:'yy-mm-dd'});
                                }
                            }
            },
            {   name:'qty_received',
                index:'qty_received',
                width:55,
                sortable:true,
                editable:true,
                align:'center',
                classes:'qtyRec',
                editoptions:{size:6}
            },
            {   name:'rc_notes',
                index:'rc_notes',
                width:250,
                sortable:false,
                editable:true,
                edittype:'textarea',
                classes:'ui-ellipsis',
                editoptions:{rows:'3',cols:'45'}
            },
            {   name:'mm_notes',
                index:'mm_notes',
                width:250,
                sortable:false,
                editable:true,
                edittype:'textarea',
                classes:'ui-ellipsis',
                editoptions:{rows:'3',cols:'45'}
            }
        ],
        pager:'#orderMMFoot',
        sortname:'o.id',
        caption:'Minor Materials Ordered for ' + ml_name,
        afterInsertRow: function(id) {
            $('tr#' + id).each(function() {
                var qtyord = $(this).find('td.qtyOrd').text();
                var qtyrec = $(this).find('td.qtyRec').text();
                if ((+qtyord === +qtyrec) && (qtyrec !== null) && (qtyrec !== 'undefined') && (qtyrec !== '')) {
                    $(this).find('td.qtyRec').removeClass('incomplete').addClass('complete');
                } else {
                    $(this).find('td.qtyRec').removeClass('complete').addClass('incomplete');
                }
            });
        },
        gridComplete: function() {
            $('.jqgrow').each(function() {
                var qtyord = $(this).find('td.qtyOrd').text();
                var qtyrec = $(this).find('td.qtyRec').text();
                if ((+qtyord === +qtyrec) && (qtyrec !== null) && (qtyrec !== 'undefined') && (qtyrec !== '')) {
                    $(this).find('td.qtyRec').removeClass('incomplete').addClass('complete');
                } else {
                    $(this).find('td.qtyRec').removeClass('complete').addClass('incomplete');
                }
            });
        },
        onSelectRow: function(id) {
            if(id && id !== lastSel) {
                mmGrid.jqGrid('restoreRow',lastSel);
                lastSel = id;
            }
            mmGrid.jqGrid('editRow',id,true);
            $('#orderMMGrid_ilsave').removeClass('ui-state-disabled');
            $('#orderMMGrid_ilcancel').removeClass('ui-state-disabled');
        },
        editurl:'/jqg/jqg.saveMinorMaterialEdit.php'
    });
    mmGrid.jqGrid('navGrid','#orderMMFoot',{
        add:false,
        edit:false,
        del:true
    });
    mmGrid.jqGrid('inlineNav','#orderMMFoot',{
        add:true,
        edit:true,
        editParams:mmEditParam,
        addParams:mmAddParam
    });
});

这是第一个jqGrid定义（AFTER），使用注释和答案.. 

function hiliteQty(i) {
    console.log('Highlighting received quantity on #' + i);
    $eRow = $('tr#' + i);
    var qtyord = $eRow.find('td.qtyOrd').text();
    var qtyrec = $eRow.find('td.qtyRec').text();
    if ((+qtyord === +qtyrec) && (qtyrec !== null) && (qtyrec !== 'undefined') && (qtyrec !== '')) {
        $eRow.find('td.qtyRec').removeClass('incomplete',100,'linear').addClass('complete',1000,'easeInElastic');
    } else {
        $eRow.find('td.qtyRec').removeClass('complete',100,'linear').addClass('incomplete',1000,'easeInElastic');
    };
}
function rcvAll(r) {
    var d = dateFormat('isoDate');
    var gridid;
    $.each(r, function(i,v) {
        var $r = $('#' + v);
        gridid = $r.closest('table').attr('id');
        var qtyOrd = $r.find('.qtyOrd').text();
        $('#' + gridid).jqGrid('editRow', v);
        if ( $r.find('.qtyRec > input').val() !== qtyOrd.parseInt() ) {
            $r.find('.qtyRec > input').val(qtyOrd);
            $r.find('.rcvDate > input').val(d);
            console.log(dateFormat('isoMicro'));
            $('#' + gridid).jqGrid('saveRow', v, false);
            console.log(dateFormat('isoMicro'));
        }
    });
    $('#' + gridid).trigger('reloadGrid');
}
$(function() {
    var ml_id = '<?=$ml_id;?>', ml_name = '<?=$objML_temp->showMLName();?>', suppno = '<?=$objML_temp->gSupp();?>', projnum = '<?=$objJob_temp->gProjectNumber();?>', job_id = '<?=$objML_temp->gJobID();?>', lastDate;
    $('#special_dialog').dialog({
        width:'auto',
        height:'auto',
        resizable:true
    });
    $.extend($.jgrid.defaults,{
        inlineData:{
            ml_id:ml_id,
            project_number:projnum,
            job_id:job_id
        },
        rowNum:1000,
        rowList:[20,50,100,500,1000],
        viewrecords:true,
        sortorder:'asc',
        height:500,
        autowidth:true,
        deepempty:true,
        altRows: true,
        grouping: true,
        groupingView: {
            groupField: ["vendor"],
            groupColumnShow: [true],
            groupText: ["<b>VENDOR: {0}</b>"],
            groupDataSorted: true,
            groupSummary: [false]
        }
    });
    //////////////////////////////
    // setup Minor Materials grid
    //////////////////////////////
    var $mmGrid = $('#orderMMGrid'),
        $mmFoot = $('#orderMMFoot'),
        mmEditParam = {
            keys: true,
            oneditfunc: function(id) {
                $('#orderMMGrid_ilsave').removeClass('ui-state-disabled');
                $('#orderMMGrid_ilcancel').removeClass('ui-state-disabled');
                hiliteQty(id);
            },
            aftersavefunc: function(id) {
                hiliteQty(id);
            }
        },
        mmAddParam = {
            rowID: 'new',
            position:'last',
            addRowParams: mmEditParam
        },
        mmAutoCompOpts = {
            source: function(request, response) {
                $.getJSON('/json/json.searchmultiMaterials.php',{term:request.term,type:'m'},function(data) {
                    response(data);
                });
            },
            minLength: 3,
            focus: function(e,ui) {
                $('input:text[name="description"]').val(ui.item.description);
                $('input:text[name="vendor"]').val(ui.item.vendor);
                $('input:text[name="mfgr_partno"]').val(ui.item.mfgr_partno);
            },
            select: function(e,ui) {
                $('input:text[name="description"]').val(ui.item.description);
                $('input:text[name="vendor"]').val(ui.item.vendor);
                $('input:text[name="mfgr_partno"]').val(ui.item.mfgr_partno);
                $('input:text[name="vendor_id"]').val(ui.item.vendor_id);
            }
        };
    $mmGrid.jqGrid({
        url: '/json/json.getMinorMaterialsOrder.php?ml_id=' + ml_id,
        datatype:'json',
        emptyrecords: 'No Minor Materials on this order',
        colNames: ['ID','Type','Supp','VID','Vendor','PO#','MasTec Part#','Manufacturer Part#','Description','Ship Date','Qty Ord','Rcvd Date','Qty Rec','Receiving Clerk Notes','Material Manager Notes'],
        colModel: [
            {   name:'id',
                index:'id',
                hidden:true,
                key:false,
                search:false,
                viewable:false
            },
            {   name:'type',
                index:'type',
                width:35,
                sortable:false,
                editable:false,
                align:'center',
                editoptions:{defaultValue:'M'}
            },
            {   name:'supp',
                index:'supp',
                width:35,
                sortable:false,
                editable:false,
                align:'center',
                editoptions:{defaultValue:suppno}
            },
            {   name:'vendor_id',
                index:'o.vendor_id',
                width:0,
                hidden:true,
                search:false,
                align:'center',
                viewable:true,
                editable:true,
                edittype:'text',
                editoptions:{size:8,readonly:true}
            },
            {   name:'vendor',
                index:'o.vendor_id',
                width:90,
                sortable:true,
                sorttype:'text',
                align:'left',
                editable:true,
                classes:'ui-ellipsis',
                edittype:'text',
                editoptions:{size:20,readonly:true},
                editrules:{required:true}
            },
            {   name:'order_number',
                index:'order_number',
                width:55,
                sortable:true,
                editable:true,
                classes:'ui-ellipsis',
                align:'center'
            },
            {   name:'mastec_partno',
                index:'mastec_partno',
                width:120,
                sortable:false,
                editable:true,
                classes:'ui-ellipsis',
                edittype:'text',
                editoptions:{
                    size:22,
                    dataInit:function(e) {
                        $(e).autocomplete(mmAutoCompOpts);
                    }
                },
                editrules:{required:true}
            },
            {   name:'mfgr_partno',
                index:'mfgr_partno',
                width:120,
                sortable:false,
                editable:true,
                classes:'ui-ellipsis',
                alilgn:'left',
                edittype:'text',
                editoptions:{size:22,readonly:true},
                editrules:{required:false}
            },
            {   name:'description',
                index:'description',
                width:180,
                sortable:false,
                align:'left',
                editable:true,
                classes:'ui-ellipsis',
                edittype:'text',
                editoptions:{size:33,readonly:true},
                editrules:{required:true}
            },
            {   name:'ship_date',
                index:'o.ship_date',
                width:85,
                sortable:true,
                sorttype:'date',
                editable:true,
                align:'center',
                editrules:{required:true},
                editoptions:{   size:15,
                                dataInit: function(l) {
                                    $(l).datepicker({dateFormat:'yy-mm-dd'});
                                }
                            }
            },
            {   name:'qty_ordered',
                index:'qty_ordered',
                width:55,
                sortable:false,
                editable:true,
                align:'center',
                classes:'qtyOrd',
                editrules:{required:true},
                editoptions:{size:6}
            },
            {   name:'rcvd_date',
                index:'o.rcvd_date',
                width:85,
                sortable:true,
                classes:'rcvDate',
                sorttype:'date',
                editable:true,
                align:'center',
                editoptions:{   size:15,
                                dataInit:function(l) {
                                    $(l).datepicker({dateFormat:'yy-mm-dd'});
                                }
                            }
            },
            {   name:'qty_received',
                index:'qty_received',
                width:55,
                sortable:true,
                editable:true,
                align:'center',
                classes:'qtyRec',
                cellattr:function(rowId,val,rawObj,cm,rdata) {
                    if (val === rawObj.qty_ordered) {
                        return ' class="complete"';
                    } else {
                        return ' class="incomplete"';
                    }
                },
                editoptions:{size:6}
            },
            {   name:'rc_notes',
                index:'rc_notes',
                width:250,
                sortable:false,
                editable:true,
                edittype:'textarea',
                classes:'ui-ellipsis',
                editoptions:{rows:'3',cols:'45'}
            },
            {   name:'mm_notes',
                index:'mm_notes',
                width:250,
                sortable:false,
                editable:true,
                edittype:'textarea',
                classes:'ui-ellipsis',
                editoptions:{rows:'3',cols:'45'}
            }
        ],
        pager:'#orderMMFoot',
        sortname:'o.id',
        caption:'Minor Materials Ordered for ' + ml_name,
        onSelectRow: function(id) {
            var savedRows = $mmGrid.jqGrid('getGridParam','savedRow');
            if(savedRows.length > 0) {
                $mmGrid.jqGrid('restoreRow', savedRows[0].id);
            }
            $mmGrid.jqGrid('editRow', id, mmEditParam);
        },
        editurl:'/jqg/jqg.saveMinorMaterialEdit.php'
    });
    $mmGrid
    .jqGrid('navGrid','#orderMMFoot',{
        add:false,
        edit:false,
        del:true
    })
    .jqGrid('navSeparatorAdd','#orderMMFoot',{
        sepclass:'ui-separator',
        sepcontent:''
    })
    .jqGrid('navButtonAdd','#orderMMFoot',{
        title:'Receive All',
        caption:'',
        buttonicon:'ui-icon-cart',
        onClickButton:function() {
            var dataRowIDs = $mmGrid.jqGrid('getDataIDs');
            rcvAll(dataRowIDs);
        },
        position:'last'
    })
    .jqGrid('navSeparatorAdd','#orderMMFoot',{
        sepclass:'ui-separator',
        sepcontent:''
    })
    .jqGrid('inlineNav','#orderMMFoot',{
        add:true,
        edit:true,
        save:true,
        cancel:true,
        editParams:mmEditParam
    });

1 个答案:

答案 0 :(得分：0)

代码中的主要问题：应该在XXEditParam内使用mmEditParam（如onSelectRow）。例如，应将mmGrid.jqGrid('editRow',id,true)替换为mmGrid.jqGrid('editRow',id,mmEditParam)。

另一个重要问题：当前代码仅为“编辑”按钮指定keys: true，aftersavefunc和其他编辑选项。添加按钮不使用选项。如果您使用某些旧版本的jqGrid，则可能会出现更多问题。您必须使用keys: true，aftersavefunc和其他编辑选项将其指定为addRowParams个addParam选项。只需尝试将addRowParams: mmEditParam属性添加到mmAddParam并使用添加。您将看到keys: true，aftersavefunc和其他编辑选项将在使用添加按钮的情况下开始工作。

相关问题
最新问题