如果在 jqgrid treegrid 中选择了某个级别行，如何隐藏其他级别

Posted 2023-05-09

【中文标题】如果在 jqgrid treegrid 中选择了某个级别行，如何隐藏其他级别

【英文标题】：how to hide other levels if some level row is selected in jqgrid treegrid

【发布时间】：2013-03-16 04:09:38

【问题描述】：

如果在 jqgrid treegrid 中选择了某行，则所有其他行都将折叠但仍然可见。如何隐藏它们。

例如如果树结构是

Category1
  Subcategory11
  Subcategory12
  ...
Category2
  Subcategory21
  Subcategory22
  ...
Category3
  Subcategory31
  Subcategory32
  ...

最初在jqgrid中以折叠形式显示

Toggle view
Category1
Category2
Category3

用户可以通过点击打开一些节点。在这种情况下（例如在 Category2 中单击）其他类别应从屏幕中删除，以便仅此类别及其子类别可见：

Toggle view
Category2
  Subcategory21
  Subcategory22

Toggle view 链接应切换单个类别和类别列表视图：第一次单击应再次显示折叠的类别列表。 之后再次点击Toggle show all categories 应该只显示上次打开的类别，如上面的屏幕截图所示。

如何实现？

treegrid 定义为

       var treegrid = $("#tree-grid");
        treegrid.jqGrid(
            loadComplete: function (data) 
                $('.tree-leaf', $(this)).css('width', '0px');
            ,
            url: '/Store/GridData',
            datatype: "json",
            mtype: "POST",
            height: "auto",
            loadui: "disable",
            treeGridModel: "adjacency",
            colModel: [
                     name: "id", width: 1, hidden: true, key: true ,
                     name: "menu", classes: "treegrid-column", label: "Tootepuu" ,
                     name: "url", width: 1, hidden: true 
                ],

            gridview: true,
            autowidth: true,
            treeGrid: true,
            ExpandColumn: "menu",
            rowNum: 2000,
            ExpandColClick: true,
            onSelectRow: function (rowid) 
                var treedata = treegrid.jqGrid('getRowData', rowid);
                window.location = treedata.url;
            
        
                );
        treegrid.parents("div.ui-jqgrid-view").children("div.ui-jqgrid-hdiv").hide();

如果选择了某个类别，则当前它会离开，而主类别列表也可见

Category1
Category2
  Subcategory21
  Subcategory22
Category3

如何为此定制 jqgrid ？或者可以使用其他一些树插件或 ASP.NET MVC2 控件吗？

【参考方案1】：

您可以像here 中描述的那样捕获展开事件

并使用

$("#"+someRow).css('display') == 'none'

隐藏所有你想要的行。