如何在 jqGrid 和 jsonReader 中使用主键

Posted 2023-02-26

【中文标题】如何在 jqGrid 和 jsonReader 中使用主键

【英文标题】：how to use primary key with jqGrid and jsonReader

【发布时间】：2012-02-27 17:46:40

【问题描述】：

我看过几篇帖子，但不明白如何使用jsonReader。我想在编辑、添加时隐藏我的主键。如果我将我的权限 ID 设为 editable:false 或隐藏它就不会编辑。

对其他帖子的任何帮助或指导都将非常感激。谢谢

这是我的代码：

$(document).ready(function()
       
        $("#list").jqGrid(
        
            url:'Users2.cfc?method=getUsers', //CFC that will return the users
            datatype: 'json', //We specify that the datatype we will be using will be JSON
            colNames:['Bill To Code','User ID', 'GL_comp_key', 'Branch ID', 'Warehouse ID', 'Final Approver',  'Active', 'Primary Approver', 'Administrative','Secondary Approver','permissionID'], //Column Names
            //The Column Model to define the data. Note you can make columns non sortable, specify width, alignment, etc.
            colModel :[
                name:'ar_bill_key',index:'ar_bill_key', width:125, sorttype:"text",editable:true,searchoptions:sopt:['eq','lt','le','gt','ge','bw','ew','cn'],
                    editable:true,edittype:"text",editoptions:size:50,editrules:required:true,formoptions:elmprefix:"(*)",
                name:'userID',index:'userID', width:125, align:"left",sorttype:"text",searchoptions:sopt:['eq','bw','ew','cn'],
                    editable:true,edittype:"text",editoptions:size:50,editrules:required:true,formoptions:elmprefix:"(*)",
                name:'gl_cmp_key',index:'gl_cmp_key', width:125, align:"left",sorttype:"text",searchoptions:sopt:['eq','bw','ew','cn'],
                    editable:true,edittype:"text",editoptions:size:50,editrules:required:true,formoptions:elmprefix:"(*)",
                name:'so_brnch_key',index:'so_brnch_key', width:125, align:"left",sorttype:"text",searchoptions:sopt:['eq','bw','ew','cn'],
                    editable:true,edittype:"text",editoptions:size:50,editrules:required:true,formoptions:elmprefix:"(*)",
                name:'so_whs_key',index:'so_whs_key', width:125,align:"left",sorttype:"text",searchoptions:sopt:['eq','bw','ew','cn'],
                    editable:true,edittype:"text",editoptions:size:50,editrules:required:true,formoptions:elmprefix:"(*)",
                name:'final_approver',index:'final_approver', width:125,align:"left",sorttype:"text",searchoptions:sopt:['eq','bw','ew','cn'],
                    editable:true,edittype:"select",editoptions:value:"1:Yes;0:No",editrules:required:true,formoptions:elmprefix:"(*)",  
                name:'active',index:'active', width:125,align:"left",sorttype:"text",searchoptions:sopt:['eq','bw','ew','cn'],
                    editable:true,edittype:"select",editoptions:value:"1:Yes;0:No",editrules:required:true,formoptions:elmprefix:"(*)",
                name:'primary_approver',index:'primary_approver', width:125,align:"left",sorttype:"text",searchoptions:sopt:['eq','bw','ew','cn'],
                    editable:true,edittype:"select",editoptions:value:"1:Yes;0:No",editrules:required:true,formoptions:elmprefix:"(*)",  
                name:'admin',index:'admin', width:125,align:"left",sorttype:"text",searchoptions:sopt:['eq','bw','ew','cn'],
                    editable:true,edittype:"select",editoptions:value:"1:Yes;0:No",editrules:required:true,formoptions:elmprefix:"(*)",  
                name:'secondary_approver',index:'secondary_approver', width:130,align:"left",sorttype:"text",searchoptions:sopt:['eq','bw','ew','cn'],
                    editable:true,edittype:"select",editoptions:value:"1:Yes;0:No",editrules:required:true,formoptions:elmprefix:"(*)",
                name:'permissionID',index:'permissionID',sorttype:"int",editable:true,searchoptions:sopt:['eq','lt','le','gt','ge'],
            ],//searchoptions parameter is used to limit the operators available during search
            pager: $('#pager'), //The div we have specified, tells jqGrid where to put the pager
            rowNum:20, //Number of records we want to show per page
            rowList:[20,30,40,50], //Row List, to allow user to select how many rows they want to see per page
            sortorder: "desc", //Default sort order
            sortname: "ar_bill_key", //Default sort column
            viewrecords: true, //Shows the nice message on the pager
            imgpath: '/images', //Image path for prev/next etc images
            caption: 'Permissions', //Grid Name
            recordtext: "Record 0 - 1 of 2",//Pager information to show
            rownumbers: true,//Show row numbers
            rownumWidth: "30",//Width of the row numbers column
            sortable: true,
            height:'auto', //I like auto, so there is no blank space between. Using a fixed height can mean either a scrollbar or a blank space before the pager
            mtype:'POST',   
            toolbar:[true,"top"], //Shows the toolbar at the top. We will use it to display user feedback
            //The JSON reader. This defines what the JSON data returned from the CFC should look like
            jsonReader: 
                root: "ROWS", //our data
                page: "PAGE", //current page
                total: "TOTAL", //total pages
                records:"RECORDS", //total records
                userdata:"USERDATA", //Userdata we will pass back for feedback
                cell: "", //Not Used
                ar_bill_key: "0" //Will default to first column
                ,
            editurl:"Users2.cfc?method=addeditUser" //The Add/Edit function call                
                           
        ).navGrid('#pager',
            
                search:true,searchtitle:"Search",//title set for hover over display
                edit:true,edittitle:"Edit User",
                add:true,addtitle:"Add User",
                del:false,deltitle:"Delete User"
            ,
        // Edit Options. savekey parameter will keybind the Enter key to submit.
        editCaption:"Edit User",edittext:"Edit",closeOnEscape:true, savekey: [true,13],errorTextFormat:commonError
            ,reloadAfterSubmit:true,bottominfo:"Fields marked with (*) are required",top:"60",left:"70",width:500, 
        width:500,addCaption:"Add User",edittext:"Add",closeOnEscape:true,savekey: [true,13],errorTextFormat:commonError,
            reloadAfterSubmit:true,bottominfo:"Fields marked with (*) are required",top:"60",left:"70", //Add Options
        url:"Users2.cfc?method=delUser",caption:"Delete User",closeOnEscape:true,errorTextFormat:commonError,top:"60",left:"70",
            reloadAfterSubmit:true, //Delete Options
         //Search Options. multipleSearch parameter lets it know we are going to use the new advanced search feature
        errorTextFormat:commonError,Find:"Search",closeOnEscape:true,caption:"Search Users",multipleSearch:true,closeAfterSearch:true
        );          

        //Function will be called when add/edit encounters an error. The returned message is what will be shown to user 
        function commonError(data)
                   
            return "Error Occured during Operation. Please try again";
        

    
);

【问题讨论】：

奥列格，感谢您的回复。我希望始终隐藏权限 ID。我找到了一种似乎可行的方法。你觉得这怎么样？ name:'permissionID',index:'permissionID',sorttype:"int",hidden:true,editable:true,resizable:false,editrules:readonly:true，另外我如何显示用户添加的消息网格标题上的 div？非常感谢！！你的帖子很棒！

【参考方案1】：

如果我理解正确您的问题，您只想在编辑期间发送permissionID，但您不需要在某处显示它。

我想，您最初的问题是您没有指定哪个 id 应该具有网格的行。 JSON 输入应包含id。如果您在jsonReader 中使用cell: "" 设置，则必须以两种方式之一指定行的id：

您将key: true 属性包含在'permissionID' 列的定义中。如果您不需要将列标记为可编辑（您可以删除editable:true）。 如果您永远不需要向用户显示列'permissionID'，您可以

删除

列'permissionID'，并在jsonReader 中包含属性id: "10"。如果我计算正确，您将主键 permissionID 作为第 10 个位置。在这种情况下，permissionID 的值将仅保存为网格的行（<tr> 元素）的id。 id 将始终在所有编辑操作中发送。

【讨论】：

如果我没有传递主键权限 ID，我将无法进行编辑，因为我的更新查询中有 WHERE permissionID = #Val(Arguments.permissionID)#。跨度>

万岁！！我使用了您对 ID ="10" 的建议，我终于弄清楚了这意味着什么，并安排了我的查询以匹配它。非常感谢当我被允许给你投票时，我会这样做！

@Sue：不客气！我很高兴能帮助你。如果问题解决了可以"accept"回答。每个接受的答案都会给您一些声誉积分。获得 15 点声望点后，您将有权每天对 30 个问题或答案进行投票。祝你好运！

@Sue：还有一条建议：您应该删除已弃用的imgpath 选项（请参阅here）。您可以考虑使用formatter: "checkbox", edittype: "checkbox"，它可以减小网格的总宽度。您可以删除所有默认属性（如align:"left",sorttype:"text"）。我建议您也使用列模板（请参阅here）。它可以减少 javascript 代码的大小并提高其可读性和可管理性。

嗨奥列格，我已经发布了一个问题：***.com/questions/9506231/…