jqGrid 필터링 할 때의 그룹화 상태

Question

jqGrid 그리드에 필터를 사용하고 있으며 데이터가 그룹으로되어있어 축소 된 첫 번째 상태가 기본값입니다. 사용자가 그룹 또는 2 (그룹 확장)를 열면 필터가 나타나고 그리드가 데이터를 다시로드하고 올바르게 필터링하지만 사용자가 연 그룹의 확장 상태가 느슨합니다. 필터를 사용하지 않을 때 축소 된 기본 상태로 다시 전환 할 수있는 방법이 있습니까? 사전에

감사합니다.

Answer 1

나는 귀하의 질문에 흥미를 느낍니다. 그래서 +1. 요구 사항을 구현하는 방법을 보여주는 데모를 만들었습니다.

구현의 주요 아이디어는 the answer과 동일합니다. 확장 된 그룹의 상태를 배열 expandedGroups에 보관하는 것이 좋습니다. jqGrid 4.0.0에 onClickGroup 콜백을 추가했습니다 (here 참조). loadComplete 콜백 내에서 배열 expandedGroups의 모든 항목을 확장하려고합니다.

이점은 페이징, 정렬 및 필터링 중에 펼쳐진 상태가 사라지지 않는다는 것입니다.

데모는 here으로 볼 수 있습니다. 데모의 코드에 아래 :

var $grid = $("#list"), expandedGroups = []; 

$grid.jqGrid({ 
    // ... some jqGrid parameters 
    grouping: true, 
    groupingView: { 
     groupField: ['name'], 
     groupCollapse: true, 
     groupDataSorted: true 
    }, 
    onClickGroup: function (hid, collapsed) { 
     var idPrefix = this.id + "ghead_", id, groupItem, i; 
     if (hid.length > idPrefix.length && hid.substr(0, idPrefix.length) === idPrefix) { 
      id = hid.substr(idPrefix.length); 
      groupItem = this.p.groupingView.sortnames[0][id]; 
      if (typeof (groupItem) !== "undefined") { 
       i = $.inArray(expandedGroups[i], groups); 
       if (!collapsed && i < 0) { 
        expandedGroups.push(groupItem); 
       } else if (collapsed && i >= 0) { 
        expandedGroups.splice(i, 1); // remove groupItem from the list 
       } 
      } 
     } 
    }, 
    loadComplete: function() { 
     var $this = $(this), i, l, index, groups = this.p.groupingView.sortnames[0]; 
     for (i = 0, l = expandedGroups.length; i < l; i++) { 
      index = groups.indexOf(expandedGroups[i]); 
      if (i >= 0) { 
       $this.jqGrid('groupingToggle', this.id + 'ghead_' + index); 
      } 
     } 
    } 
}); 
$grid.jqGrid('navGrid', '#pager', {add: false, edit: false, del: false}, {}, {}, {}, 
    {multipleSearch: true, multipleGroup: true, closeOnEscape: true, showQuery: true, 
     closeAfterSearch: true}); 

업데이트 :있는 jqGrid의 그룹화 모듈은 내 원래의 대답 때문에 많은 부분에서 변경됩니다. 수정 된 데모 버전은 here입니다. 사용 된 코드의 가장 중요한 부분은 아래에서 볼 수 있습니다.

grouping: true, 
groupingView: { 
    groupField: ["invdate"], 
    groupCollapse: true, 
    groupDataSorted: true 
}, 
onClickGroup: function (hid, collapsed) { 
    var idPrefix = this.id + "ghead_", i, groupid, 
     $this = $(this), 
     groups = $(this).jqGrid("getGridParam", "groupingView").groups, 
     l = groups.length; 

    if (!inOnClickGroup) { 
     inOnClickGroup = true; // set to skip recursion 
     for (i = 0; i < l; i++) { 
      groupid = idPrefix + groups[i].idx + "_" + i; 
      if (groupid !== hid) { 
       $this.jqGrid("groupingToggle", groupid); 
      } 
     } 
     inOnClickGroup = false; 
    } 
} 

변수 inOnClickGroup은 외부 범위에 정의되어 있습니다.