Question

我可以使代码在3种功能（“远程数据”，“冻结列”和“内联操作按钮”）中的2种起作用。但是，当同时使用这三个功能时，当我单击按钮时，操作按钮将不响应。

我尝试了所有组合：

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

下面是我的代码：

<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。问题是缺少formatter: "action"事件与冻结列的div中autowidth: true的按钮的绑定。

我不建议您使用

$('.form-control-login').parent().toggleClass('is-empty', $('.form-control-login').val().trim().length == 0);

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

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

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

1 个答案: