jqgrid远程数据+冻结列+内联动作按钮=动作按钮无响应？

Question

我可以使我的代码在 3 个功能（"remote data"、"frozen column" 和 "inline action buttons"）中的任意 2 个中工作。但是当同时使用这 3 个功能时，当我点击按钮时操作按钮没有响应。

我尝试了所有组合：

远程数据 + 内联操作按钮 = OK
本地数据+冻结列+内联操作按钮=确定
远程数据 + 冻结列 + 内联操作按钮 = 不正常

下面是我的代码：

<script type="text/ecmascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script type="text/ecmascript" src="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.15.4/jquery.jqgrid.min.js"></script>
<script type="text/javascript" src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.1.1/plugins/jquery.contextmenu.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/themes/redmond/jquery-ui.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.15.4/css/ui.jqgrid.min.css">

    $(document).ready(function () {
        var lastSel;
        $("#jqGrid").jqGrid({
            url: "/WEB/fundingMasterList.action",
            datatype: "json",
            colModel: [
                { label: "Actions", name: "actions", width: 55, align: 'center', sortable: false, frozen:true, formatter: "actions", formatoptions: {
                        keys: false,
                        delbutton: false,
                        onEdit: function(id) {
                            alert("onEdit called!");
                        }
                    },
                    classes:'frozen'
                },
                { name: "itemId", label: "Item", frozen:true, hidden:true, key:true },
                { name: "funding.division", label: "Div", frozen:true, editable:"hidden", width:80, classes:'frozen'},
                { name: "funding.ro2", label: "SE", frozen:true, editable:true, width:80, classes:'frozen' },
                { name: "funding.ro1", label: "E or RM", frozen:true, editable:true, width:80, classes:'frozen' },
                { name: "id.typeOfFunding", label: "Type", frozen:true, editable:"hidden", width:50, classes:'frozen' },
                { name: "id.recordId", label: "Funding<br/>Ref. No.", frozen:true, editable:"hidden", width:120, classes:'frozen' },
                { name: "id.fiscalYear", label: "Year of<br/>Funding", frozen:true, editable:"hidden", width:80, classes:'frozen' },
                { name: "funding.client", label: "Client", width:100, editable:"hidden" },
                { name: "funding.typeOfClient", label: "Client Nature", editable:"hidden" }
            ],
            onSelectRow: function(id){
                if(id && id!==lastSel){ 
                    $('#jqGrid').jqGrid('restoreRow',lastSel); 
                    lastSel=id; 
                }
            },
            cmTemplate: { title: false },
            loadonce: true,
            viewrecords: true,
            rowNum: 50,
            gridview:true,
            shrinkToFit: false, // must be set with frozen columns, otherwise columns will be shrank to fit the grid width
            autowidth: true, 
            height: 610,
            footerrow : true,
            rownumbers:true,
            pgbuttons : true,
            pginput : true,
            viewsortcols: [true, 'vertical', true],
            emptyrecords: "No records to display",
            pager: "#pager"
        });
        $("#jqGrid").jqGrid("setFrozenColumns");
    });

谢谢

Answer 1

感谢您的错误报告。我承诺 the corresponding fix 到 GitHub。问题是缺少 click 事件与冻结列 div 中 formatter: "action" 按钮的绑定。

不推荐你使用

autowidth: true

在使用冻结列的情况下，尤其是对于使用大量冻结列的网格。冻结 div 无法滚动。因此，网格的宽度必须大于所有冻结列的总宽度。

演示 https://jsfiddle.net/La3cxu2e/2/ 直接从 GitHub 加载所有 jqGrid 文件。

jqgrid远程数据+冻结列+内联动作按钮=动作按钮无响应？

jqgrid remote data + frozen column + inline action buttons = action button no response?

jquery

jqgrid