0

我正在尝试删除记录，但我被卡住了。我已经隐藏了应用程序 ID 列，如果我在 navGrid 中按下删除按钮，我需要将 AppID 作为参数传递给控制器​​。

我试过了，但我得到了空值。我记录了 postdata，因为我只获得了 id(id=10) 的值。

我需要传递 AppID 而不是 id。我怎样才能做到这一点？

查看页面：

<div id="JqGridExampleContainer">
    <table id="ApplicationDetailsTable">
    </table>
    <div id="JQGridPaging"></div>
</div>

脚本：

function showJQGrid() {
        $("#ApplicationDetailsTable").jqGrid({
            width: 800,
            height: '100%',
            url: '@Url.Action("AppListDetails", "JQGridHome")',
            datatype: 'json',
            mtype: "GET",
            colNames: ["Application ID", "TenantId", "Application Name", "Actions","Inbuild Actions"],
            colModel: [
            { name: 'AppId', index: 'AppId', hidden: true },
            { name: 'TenantId', index: 'TenantId', resizable: true, align: 'center', title: false, sortable: true, searchoptions: { sopt: ['eq', 'ne', 'le', 'lt', 'gt', 'ge'] }, searchtype: "number" },
            { name: 'AppName', index: 'AppName', sortable: true },
            { name: 'Actions', sortable: false, search: false, fixed: true,align:'center',
                formatter: function () {
                    return "<img src='../../Images/edit-icon.png' alt='Edit' id='editID' style='margin-left:12px;height:18px;width:18px;cursor:pointer;' /><img src='../../Images/Trash-can-icon.png' alt='Edit' id='deleteID'style='margin-left:12px;height:18px;width:18px;cursor:pointer;' onclick='deleteApplication()' />";
                }
            },
            { name: 'myac', width: 80, fixed: true, resizable: false, sortable: false, search: false, resize: false, formatter: 'actions',
                formatoptions: { keys: true}
            },
            ],
            rowNum: 10,
            rowList: [5, 10, 20, 30],
            pager: '#JQGridPaging',
            viewrecords: true,
            caption: "Application List Details",
            sortname: "TenantId",
            sortorder: "asc",
            altRows: true,
            altclass: 'jqgaltrow',
            hoverrows: true,
            loadonce: true,
            gridview: false,
            rownumWidth: 40,
            rownumbers: true,
            multiSort: true,
            hidegrid: true,
            toppager: false,
            pgbuttons: true,
            jsonReader: {
                root: 'AllApplicationList',
            },
            shrinkToFit: true,
            emptyrecords: "No records to view",
            loadtext:'Loading Data please wait ...'
        });
        jQuery("#ApplicationDetailsTable").jqGrid('filterToolbar', { searchOperators: false,searchOnEnter: false, });
        $("#ApplicationDetailsTable").jqGrid('navGrid', '#JQGridPaging',
            {
                refresh: false, add: false, edit: false, del: true, search: true,
                searchtext: "Search",
                addtext: "Add",
                edittext: "Edit",
                deltext: "Delete",
                deltitle: "Delete Application",
                refreshtext: "Refresh",
                position: 'left'
            },
                {},
                {},
                {
                    mtype: "POST",
                    reloadAfterSubmit: true,
                    url: '@Url.Action("DeleteApplicationDetails", "JQGridHome")',
                    resize: false,
                    closeOnEscape: true,
                    drag: false,
                    ajaxDelOptions: { contentType: 'application/json; charset=utf-8' },
                    serializeDelData: function (postdata) {
                        alert(postdata);
                        console.log(postdata);
                        return JSON.stringify({ AppId: postdata.id });
                    }
                },
                { sopt: ['eq', 'cn', 'lt', 'le', 'bw', 'bn', 'in'], closeOnEscape: true, multipleSearch: true, overlay: true, width: 460, closeAfterSearch: true }
         );
    }

     $(document).ready(function () {
        showJQGrid();
    });

来自服务器端的 JSON 响应：

{"AllApplicationList":[{"AppId":1004,"TenantId":1,"AppName":"Sensiple IT Help Desk"}, {"AppId":2000,"TenantId":1,"AppName":"HR帮助台"}, {"AppId":3000,"TenantId":1,"AppName":"Admin Desk"}, {"AppId":4000,"TenantId":1,"AppName":"Transport Facility"} , {"AppId":5000,"TenantId":2,"AppName":"安全服务"}, {"AppId":6000,"TenantId":5,"AppName":"Premises"},{"AppId" :6001,"TenantId":8,"AppName":"总公司"},{"AppId":6002,"TenantId":14,"AppName":"票务事件"}, {"AppId":6003,"租户 ID”：14,"AppName":"餐饮服务"}, {"AppId":6005,"TenantId":14,"AppName":"清洁服务"}]}

图片：

在此处输入图像描述

注意AppID是隐藏的。此外，该行在客户端被删除，但在数据库中没有被删除。这意味着如果我将页面重新加载到已删除的行，将显示。

4

1 回答 1

1

您可以通过 modyfing选项告诉 jqGrid 您想将AppId列用作行 ID ：jsonReader

$('#ApplicationDetailsTable').jqGrid({
    ...
    jsonReader: {
        root: 'AllApplicationList',
        id: 'AppId'
    },
    ...
});

这样，行的实际 id 将是你的AppId，你不需要做任何技巧来正确处理所有操作。

于 2013-08-21T09:46:27.787 回答