點擊分組列的展開圖標

Question

分組之後時，不要自動展開所有亞格行，是否有擴大當前行的/摺疊圖標不會自動展開/摺疊所有子網格的行的方法嗎？就這樣保持原樣。

var parmColumnName = 'Model'; 

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

//玩過之後的原始設置。 （見寶馬X5下）

//關閉的分組讓

//然後展開分組製作（所有型號的默認擴展，我不知道希望它改變，我希望它看起來像上面的原始快照）

Answer 1

我覺得你的問題很有趣，但對於問題的解決方案是不容易的。在我看來，兩種方法的jqGrid和groupingRender特別groupingToggle的源代碼應該改變。我建議你的解決方案可以在演示中看到。該演示將覆蓋的groupingRender和groupingToggle方法原代碼。我將在下面找到更多關於我的建議的完整描述。

首先我想用我的話來描述這個問題。你在你的問題的文本中使用了「子網格的行」這個詞，這會帶來誤解。你用什麼多級分組。在我看來，第一個問題是groupCollapse: true選擇的行爲。在多層分組的情況下，jqGrid目前崩潰只有數據而不是所有的分組頭，直到頂層。 The demo使用3級分組和選項groupCollapse: true。它dysplays

，而不是直觀地預計

，你在你的問題制定是花費的當前行爲的另一個問題。問題是，如果用戶已經將節點摺疊爲看起來很緊湊，就像我發佈的最後一張照片一樣，那麼用戶展開某個節點jqGrid展開節點的所有子節點組標題，直到數據。因此，如果僅擴展例如「測試1」節點，則其所有子節點將被擴展，而不是僅在下一個分組級別中花費。

要解決的第一個問題（儘管groupCollapse: true打開子分組報頭），我改變one linegroupingRender方法從

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演示了我建議的所有更改的結果。我會將更改作爲pull請求發佈到trirand。我希望這些更改將包含在jqGrid的主代碼中。

已更新：我發佈了the pull request，其中包含上面我提出的更改。

UPDATED 2：我的pull請求與jqGrid的主代碼合併在一起。今天發佈的jqGrid 4.5.4新版本包含了已更改的版本。 The new demo使用jqGrid 4.5.4，它的工作方式與您的預期相同。所以要解決你在你的問題中描述的問題，你只需要更新jqGrid。