jqgrid删除表

时间:2015-12-01 09:29:09

标签: jquery jqgrid

我在删除表格行时遇到问题。

我有两张桌子。

第一个表包含来自我本地数据库的数据。

如果我选择复选框并单击批准,则选定的行将被复制到第二个表格,其类型为“批准”(如果我点击结算,其类型将是结算)。

enter image description here enter image description here

当我尝试使删除功能有效时,它会删除错误的值,或者不会删除任何行。

以下是我的代码:

var common = {
        basUrl : function (){
            var l = window.location;
            var url =  "/" + l.pathname.split('/')[1] + "/";
            return url;
        },
        init : function(){
            common.validator();
            common.initDialog();
            common.extendJqgrid();
            common.bindEvent();
            common.datePicker();
            common.initButton();
            common.searchGrid();
            common.initGrid();
        },

        initGrid : function() {

            $("#employeeList").jqGrid(
                    {
                        url: "<c:url value='/app/getGrid'/>",
                        colNames : ['id', 'Department', 'Position', 'Employee'],
                        colModel : [
                                 {
                                    name : 'employeeId',
                                    index : 'employeeId',
                                    hidden : true,
                                    key : true
                                 },
                                 {
                                    name : 'department',
                                    index : 'department',
                                    width : 280,
                                    align : "center",
                                 },
                                 {
                                    name : 'position',
                                    index : 'position',
                                    width : 280,
                                    align : "center",
                                 },
                                 {
                                    name : 'employeeName',
                                    index : 'employeeName',
                                    width : 280,
                                    align : "center",
                                 }, 
                         ],
                         rowNum : 10,
                         multiselect : true,
                         multiboxonly: true,
                         pager : '#pager3',
                         viewrecords : true,
                         sortname : 'department',
                         sortorder : "asc",
                         search : false,
                         onSelectRow : function(id, status, e){
                             var selectRowId = $("#employeeList").jqGrid('getGridParam', 'selrow');
                             if (selectRowId != null) {
                                $("#btnApprovalCon, #btnSettlementCon, #btnEnforcementCon, #btnReferenceCon").button("option", "disabled", false);
                             } else {
                                $("#btnApprovalCon, #btnSettlementCon, #btnEnforcementCon, #btnReferenceCon").button("option", "disabled", true);
                                var rowData = null;
                             }
                         },
                         onSelectAll : function(rowId, status) {
                            if (status){
                                $("#btnApprovalCon, #btnSettlementCon, #btnEnforcementCon, #btnReferenceCon").button("option", "disabled", false);
                             } else {
                                $("#btnApprovalCon, #btnSettlementCon, #btnEnforcementCon, #btnReferenceCon").button("option", "disabled", true);
                             }
                         },
                         gridComplete : function(){
                             $("#btnApprovalCon").on('click', function(selrow) {

                                    var list = $("#employeeList").jqGrid ('getGridParam', 'selarrrow'); //arrayList
                                    if(list != null){
                                        $.each(list, function(i,v){
                                                var rowData = $("#employeeList").jqGrid('getRowData', v);
                                                console.log(rowData);
                                                var rowCount = $("#reportingList").jqGrid('getGridParam', 'records');
                                                var rowNum = rowCount + 1;
                                                var data = {appset_employeeId: rowData.employeeId, appset_department: rowData.department, appset_position:rowData.position, appset_employeeName:rowData.employeeName, type:'Approval'}
                                                $("#reportingList").jqGrid('addRowData', rowData.id, data);
                                        });
                                    }

                                });
                             $("#btnSettlementCon").on('click', function(selrow) {
                                    var list = $("#employeeList").jqGrid ('getGridParam', 'selarrrow'); //arrayList(object)
                                    if(list != null){
                                        $.each(list, function(i,v){
                                                var rowData = $("#employeeList").jqGrid('getRowData', v);
                                                console.log(rowData);
                                                var rowCount = $("#reportingList").jqGrid('getGridParam', 'records');
                                                var rowNum = rowCount + 1;
                                                var data = {appset_employeeId: rowData.employeeId, appset_orderNumber: rowNum,  appset_department: rowData.department, appset_position:rowData.position, appset_employeeName:rowData.employeeName, type:'Settlement'}
                                                $("#reportingList").jqGrid('addRowData', rowData.id, data);
                                        });
                                    }
                                });
                         }
                    }).navGrid("#pager3", { search:false, edit:false, add:false, del:false});   

            $("#reportingList").jqGrid(
                    {
                        colNames : ['id', 'Department', 'Position', 'Employee', 'Type'],
                        colModel : [
                         {
                            name : 'appset_employeeId',
                            index : 'appset_employeeId',
                            hidden : true,
                            key : true
                         },
                         {
                            name : 'appset_department',
                            index : 'appset_department',
                            width : 210,
                            align : "center",
                         },
                         {
                            name : 'appset_position',
                            index : 'appset_position',
                            width : 210,
                            align : "center",
                         },
                         {
                            name : 'appset_employeeName',
                            index : 'appset_employeeName',
                            width : 210,
                            align : "center",
                         },
                         {
                            name : 'type',
                            index : 'type',
                            width : 210,
                            align : "center",
                         }, ],
                         rowNum : 10,
                         multiselect : true,
                         multiboxonly: true,
                         pager : '#pager4',
                         viewrecords : true,
                         search : false,
                         viewrecords : true,
                         onSelectRow : function(id, status, e){
                             var selectRowId = $("#reportingList").jqGrid('getGridParam', 'selrow');
                             if (selectRowId != null) {
                                $("#btnAppSetDel").button("option", "disabled", false);
                             } else {
                                $("#btnAppSetDel").button("option", "disabled", true);
                                var rowData = null;
                             }
                         },
                         onSelectAll : function(rowId, status) {
                            if (status){
                                $("#btnAppSetDel").button("option", "disabled", false);
                             } else {
                                $("#btnAppSetDel").button("option", "disabled", true);
                             }
                         },
                         gridComplete : function(selrow){
                            $("#btnAppSetDel").on('click', function() {
                                var list = $("#employeeList").jqGrid ('getGridParam', 'selarrrow'); //arrayList(object)

                                $("#reportingList").jqGrid('delRowData', 'selarrow');
                                /*
                                if(list != null){
                                    $.each(list, function(i,v){
                                        $("#reportingList").jqGrid('delRowData', 'v');
                                    });
                                }
                                */
                            });
                         }
                    }).navGrid("#pager4", { search:false, edit:false, add:false, del:true});

            $("#reportingList").sortableRows();
            $("#reportingList").jqGrid('gridDnD');
        },

我尝试导入delRowData,但我不确定我是否正确使用它。

我可以问你我想做什么吗?

提前谢谢。

1 个答案:

答案 0 :(得分:1)

我认为你的问题的根源是id重复。您在同一页面上有两个网格。两个网格都具有seekbar属性的列(第一个网格中为key: true,第二个网格中为employeeId)。我想你可以为两个网格的行设置相同的id值

为了保护您的项目免受此类问题的影响,您应该在至少一个网格中使用appset_employeeId选项。例如,您可以在第一个网格中使用idPrefix,在第二个网格中使用idPrefix: "g1_"idPrefix: "g2_"选项将通知jqGrid基于idPrefix构建rowid,但使用指定的前缀。它会使两个网格中的rowid不同。