Question

我正在使用free-jqgrid 4.15.2作为导航。它处于树模式，当用户折叠节点时，默认行为是立即选择它。我希望他们能够隐藏菜单的各个部分而不选择单击的行，但似乎没有与扩展和折叠tree_mode节点相对应的易于访问的事件。

我在我的主分支中有这些事件，但我们转向free-jqgrid打破了它。这是使用jqgrid的早期版本的工作代码。

$.jgrid.extend({
    expandNode: function ( rc ) {
        debugger
    },
    collapseNode: function ( rc ) {
        debugger
    }
});

我也尝试过劫持setTreeNode，但我的扩展文件中缺少全局变量。

setTreeNode: function () {
        // TODO: Move the code in setTreeGrid because it uses currently no parameters
        // and it's don't make any actions with specific row
        return this.each(function () {
            var continue_selection = true;
            var $t = this, $self = $($t), p = $t.p;
            if (!$t.grid || !p.treeGrid) { return; }
            var expanded = p.treeReader.expanded_field,
                isLeaf = p.treeReader.leaf_field,
                beforeSelectRow = function (e, rowid, eOrg) {
                    if (eOrg != null) {
                        var $target = $(eOrg.target),
                            $td = $target.closest("tr.jqgrow>td"),
                            $tr = $td.parent(),
                            expendOrCollaps = function () {
                                var item = p.data[p._index[stripPref(p.idPrefix, rowid)]],
                                    collapseOrExpand = item[expanded] ? "collapse" : "expand";
                                if (!item[isLeaf]) {
                                    base[collapseOrExpand + "Row"].call($self, item, $tr);
                                    continue_selection = base[collapseOrExpand + "Node"].call($self, item, $tr);
                                }
                            };
                        if ($target.is("div.treeclick")) {
                            expendOrCollaps();
                        } else if (p.ExpandColClick) {
                            if ($td.length > 0 && $target.closest("span.cell-wrapper", $td).length > 0) {
                                expendOrCollaps();
                            }
                        }
                        return true; // allow selection
                    }
                };

            if (continue_selection) {
                $self.off("jqGridBeforeSelectRow.setTreeNode");
                $self.on("jqGridBeforeSelectRow.setTreeNode", beforeSelectRow);
            }
        });
    },

如何在展开或折叠节点时阻止行选择？

Answer 1

行的选择是jqGrid的基本功能，它与TreeGrid的使用无关。换句话说，可以使用beforeSelectRow来阻止点击ExpandColumn列时的行选择，并使用selectOnContextMenu: false来防止点击鼠标右键选择行（在上下文菜单中）。相应的beforeSelectRow代码如下：

beforeSelectRow: function (iRow, e) {
    var $td = $(e.target).closest("tr.jqgrow>td"),
        iCol = $td.length > 0 ? $td[0].cellIndex : -1,
        p = $(this).jqGrid("getGridParam"),
        cm = iCol >= 0 ? p.colModel[iCol] : null;

    if (cm != null && cm.name === p.ExpandColumn &&
            $(e.target).closest(".tree-wrap").length > 0) {

        return false; // prevent row selection
    }
    return true;
}

如果单击TreeGrid的展开/折叠图标，上面的代码会阻止选择。可以从$(e.target).closest(".tree-wrap").length > 0移除if部分，以防止选择列中任何位置的点击。如果使用ExpandColClick: true选项，则可能很实用。

如何在free-jqgrid中阻止tree_mode节点上的行选择崩溃？

1 个答案: