Question

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

我试过了但是我得到了空值。我记录了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 Help Desk”}， {“AppId”：3000，“TenantId”：1，“AppName”：“Admin Desk”}， {“AppId”：4000，“TenantId”：1，“AppName”：“运输工具”}， {“AppId”：5000，“TenantId”：2，“AppName”：“安全服务”}， { “的AppId”：6000， “TenantId”：5 “AppName的”： “处所”}，{ “的AppId”：6001， “TenantId”：8中， “AppName的”：“头 Office“}，{”AppId“：6002，”TenantId“：14，”AppName“：”Ticket Incident“}， {“AppId”：6003，“TenantId”：14，“AppName”：“Food Service”}， {“AppId”：6005，“TenantId”：14，“AppName”：“清洁服务”}}}

图片：

enter image description here

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

Answer 1

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

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

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

如何在删除时将JqGrid隐藏表数据传递给控制器

1 个答案: