Question

分组后，有没有办法让当前行的展开/折叠图标不会自动展开/折叠所有子网格的行？请保持原样。

var parmColumnName = 'Model';

$('#test').jqGrid('groupingGroupBy'), 
   parmColumnName, 
   {
       groupCollapse: true,
       groupField: ['name']
   }
);

//玩弄它后的原始设置。（参见BMW下的X5）

enter image description here

//折叠分组制作

enter image description here

//然后展开分组Make（默认情况下展开所有模型，我不希望它改变，我希望它看起来像上面的原始快照）

enter image description here

Answer 1

我觉得你的问题非常有趣，但问题的解决方案并不容易。在我看来，应该更改两个jqGrid方法groupingRender的源代码，尤其是groupingToggle。我建议您在演示中看到的解决方案。该演示将覆盖groupingRender和groupingToggle方法的原始代码。有关我的建议的更完整描述，请参阅下文。

首先，我想用我的话来描述这个问题。您在问题文本中使用了“子网格行”这些词语，这会带来误解。您使用的是多级分组。我认为的第一个问题是groupCollapse: true选项的行为。在多级分组的情况下，jqGrid折叠当前仅数据而不是所有分组标题直到顶级。 The demo使用3级分组和groupCollapse: true选项。它发挥不良

enter image description here

而非直观预期

enter image description here

您在问题中提出的另一个问题是当前的消费行为。问题是，如果用户已经将节点折叠成所有看起来紧凑的节点，就像我发布的最后一张图片那样结束，那么用户展开一些节点 jqGrid展开节点的所有子节目分组，直到数据。因此，如果只扩展一个“test1”节点，那么它的所有子节点都将被扩展，而不是只消耗下一个分组级别。

要解决第一个问题（尽管groupCollapse: true打开了子分组标题），我更改了groupingRender方法的one line

str += "<tr id=\""+hid+"\" role=\"row\" class= \"ui-widget-content jqgroup ui-row-"+$t.p.direction+" "+clid+"\"><td style=\"padding-left:"+(n.idx * 12) + "px;"+"\" colspan=\""+colspans+"\">"+icon+$.jgrid.template(grp.groupText[n.idx], gv, n.cnt, n.summary)+"</td></tr>";

到

str += "<tr id=\""+hid+"\"" +(grp.groupCollapse && n.idx>0 ? " style=\"display:none;\" " : " ") + "role=\"row\" class= \"ui-widget-content jqgroup ui-row-"+$t.p.direction+" "+clid+"\"><td style=\"padding-left:"+(n.idx * 12) + "px;"+"\" colspan=\""+colspans+"\">"+icon+$.jgrid.template(grp.groupText[n.idx], gv, n.cnt, n.summary)+"</td></tr>";

你问的主要问题有点困难。

下面你可以找到固定版本

$.jgrid.extend({
    groupingToggle : function(hid){
        this.each(function(){
            var $t = this,
            grp = $t.p.groupingView,
            strpos = hid.split('_'),
            uidpos,
            //uid = hid.substring(0,strpos+1),
            num = parseInt(strpos[strpos.length-2], 10);
            strpos.splice(strpos.length-2,2);
            var uid = strpos.join("_"),
            minus = grp.minusicon,
            plus = grp.plusicon,
            tar = $("#"+$.jgrid.jqID(hid)),
            r = tar.length ? tar[0].nextSibling : null,
            tarspan = $("#"+$.jgrid.jqID(hid)+" span."+"tree-wrap-"+$t.p.direction),
            getGroupingLevelFromClass = function (className) {
                var nums = $.map(className.split(" "), function (item) {
                            if (item.substring(0, uid.length + 1) === uid + "_") {
                                return parseInt(item.substring(uid.length + 1), 10);
                            }
                        });
                return nums.length > 0 ? nums[0] : undefined;
            },
            itemGroupingLevel,
            collapsed = false, tspan;
            if( tarspan.hasClass(minus) ) {
                if(grp.showSummaryOnHide) {
                    if(r){
                        while(r) {
                            if($(r).hasClass('jqfoot') ) {
                                var lv = parseInt($(r).attr("jqfootlevel"),10);
                                if(  lv <= num) {
                                    break;
                                }
                            }
                            $(r).hide();
                            r = r.nextSibling;
                        }
                    }
                } else  {
                    if(r){
                        while(r) {
                            itemGroupingLevel = getGroupingLevelFromClass(r.className);
                            if (itemGroupingLevel !== undefined && itemGroupingLevel <= num) {
                                break;
                            }
                            $(r).hide();
                            r = r.nextSibling;
                        }
                    }
                }
                tarspan.removeClass(minus).addClass(plus);
                collapsed = true;
            } else {
                if(r){
                    var showData = undefined;
                    while(r) {
                        itemGroupingLevel = getGroupingLevelFromClass(r.className);
                        if (showData === undefined) {
                            showData = itemGroupingLevel === undefined; // if the first row after the opening group is data row then show the data rows
                        }
                        if (itemGroupingLevel !== undefined) {
                            if (itemGroupingLevel <= num) {
                                break;// next item of the same lever are found
                            } else if (itemGroupingLevel === num + 1) {
                                $(r).show().find(">td>span."+"tree-wrap-"+$t.p.direction).removeClass(minus).addClass(plus);
                            }
                        } else if (showData) {
                            $(r).show();
                        }
                        r = r.nextSibling;
                    }
                }
                tarspan.removeClass(plus).addClass(minus);
            }
            $($t).triggerHandler("jqGridGroupingClickGroup", [hid , collapsed]);
            if( $.isFunction($t.p.onClickGroup)) { $t.p.onClickGroup.call($t, hid , collapsed); }
            });
        return false;
    },
});

The demo演示了我建议的所有更改的结果。我将更改作为拉取请求发布到trirand。我希望这些更改将包含在jqGrid的主代码中。

更新：我发布了the pull request以及我上面建议的更改。

更新2 ：我的拉取请求与jqGrid的主要代码合并。今天发布的新的4.5.4版本的jqGrid包括已更改的版本。 The new demo使用jqGrid 4.5.4，它的工作方式与预期的一样。因此，要解决您在问题中描述的问题，您只需更新jqGrid。

单击分组列的展开图标时，不要自动展开所有子网格行

1 个答案: