【问题标题】:how to hide other levels if some level row is selected in jqgrid treegrid如果在 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 控件吗?

【问题讨论】:

    标签: jquery asp.net-mvc jquery-plugins asp.net-mvc-2 jqgrid


    【解决方案1】:

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

    并使用

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

    隐藏所有你想要的行。

    【讨论】:

      猜你喜欢
      • 2013-03-16
      • 1970-01-01
      • 2021-01-27
      • 1970-01-01
      • 2022-11-12
      • 2018-02-25
      • 2011-10-04
      • 2021-09-30
      • 1970-01-01
      相关资源
      最近更新 更多