jqgrid 그룹화에서 확장/축소 상태를 유지하는 방법은 무엇입니까?

Question

나는 그룹핑 방법에서 jqgrid를 구현했다. 기본적으로 나는 groupCollapse:true 매개 변수 jqgrid를 사용하여 그룹을 접음 상태로 유지했습니다. 내 표가 잘 작동하지만 그룹을 확장하고 열을 정렬하면 전체 표가 다시로드되고 열의 확장 상태가 유지되지 않습니다. 정렬하는 동안 펼친 상태를 유지하려면 어떻게해야합니까?

Answer 1

항상 빠른 시간 내에 연락 드릴 것입니다있는 버전을 사용있는 jqGrid의 (사용할 수 있습니다), 그리고 (버전 < = 4.7 free jqGrid, 상업 Guriddo jqGrid JS하거나 이전있는 jqGrid)하는 포크에서.

귀하의 요구 사항은 내가 개발 한 "무료 jqGrid"에서 쉽게 실현 될 수 있습니다. 부울을 반환하는 콜백 함수로 groupCollapse을 사용할 수 있습니다 (the issue 참조). onClickGroup 콜백 또는 jqGridGroupingClickGroup 이벤트와 결합하여 쉽게 그룹화 상태를 유지할 수 있습니다.

업데이트]

: 나는 하나가 그룹 그리드에 붕괴 상태를 유지할 수있는 방법을 보여줍니다 데모 https://jsfiddle.net/92da8xhq/을 만들었습니다. 아래에서는 코드를 간단히 설명합니다. 데모에서는 한 수준의 그룹화를 사용하여 이해하기 쉽도록 코드를 작성합니다.

jqGrid에 사용자 정의 collapsedGroups: {} 매개 변수를 추가했습니다. 매개 변수를 사용하여 접힌 그룹 목록을 보관합니다. 데모에서 collapsedGroups: { "test2": true }을 사용하여 처음에 축소 된 그룹으로 그리드를 만들 수 있음을 보여주었습니다. 우리는 collapsedGroups 객체의 값을 사용하지 않습니다. test2 속성의 존재는 예를 들어 값이 test2 인 그룹이 축소 된 상태임을 나타냅니다.

데모에서는 groupCollapse 속성 인 groupingView을 콜백 기능으로 정의했습니다. 그룹 축소 기의 목록에서인지 기능 검사 본다 그룹의 축소/확대 후에 별도로 정의 collapsedGroups 파라미터의 속성을 조정

groupingView: { 
    groupField: ["name"], 
    groupCollapse: function (options) { 
     var collapsedGroups = $(this).jqGrid("getGridParam", "collapsedGroups") || {}; 
     // options looks like { group: number, rowid: string } 
     if (collapsedGroups.hasOwnProperty(options.group.value)) { 
      return true; 
     } 
     return false; 
    } 
} 

(어떤 값 collapsedGroups 속성을 갖는다). 우리는 다음과 같은 onClickGroup 콜백 사용

onClickGroup: function (hid, isCollapsed) { 
    var p = $(this).jqGrid("getGridParam"), 
     iGroup = $(this).jqGrid("getGroupHeaderIndex", hid), 
     group = p.groupingView.groups[iGroup]; 

    if (p.collapsedGroups == null) { 
     // be sure that the custom parameter is initialized as an empty object 
     p.collapsedGroups = {}; 
    } 
    if (isCollapsed) { 
     // we place group.value in the p.collapsedGroups object as a property 
     if (!p.collapsedGroups.hasOwnProperty(group.value)) { 
      // create the property group.value in with some value 
      p.collapsedGroups[group.value] = true; 
     } 
    } else if (p.collapsedGroups.hasOwnProperty(group.value)) { 
     // remove group.value property from the p.collapsedGroups object 
     delete p.collapsedGroups[group.value]; 
    } 
}