free-jggrid treeGrid가 테이블 하단에 펼쳐집니다.

Question

이베이 (eBay) 카테고리에 treeGrid를 사용하고 싶습니다.

모든 범주 (그림 : collapsed categories) 붕괴 시작일 :

내 테이블 정의 하위 카테고리가 테이블의 하단에 확장하고 우표에 klicking 후

을하지 (expanded category Stamps 그림) 우표 아래 :

$('#list').jqGrid({ 
cmTemplate:{sortable:false, autoResizable: true}, 
multiSort: false, 
url:'/admin/ebay/kategorien/get_jqgrid', 
datatype:'json', 
mtype:'POST', 
jsonReader:{ repeatitems: false }, 
colModel:[{name:'id',index:'id',width:1,hidden:true,key:true}, 
      {name:'name', label:'Name', width:200}, 
      {name:'site_id', label:'Site', width:60}, 
      {name:'cat_id', label:'Kat.-ID', width:60}, 
      {name:'leaf_category', label:'Erlaubt', width:60}, 
      {name:'in_use', label:'Benutzen', width:64, 
      formatter:'checkbox', align:'center', stype:'select', 
      editoptions:{value:':Alle;-:-;+:+'}}], 
pager:'#pager', 
height:'auto', 
autowidth:false, 
shrinkToFit:false, 
guiStyle: 'bootstrap', 
viewrecords:true, 
gridview:true, 
loadComplete: function() { 
$(this).triggerHandler('resize.jqGrid'); 
}, 
editurl:'/admin/ebay/kategorien/edit', 
iconSet:'fontAwesome', 
treeGrid:true, 
treeGridModel:'adjacency', 
ExpandColumn:'name', 
ExpandColClick:'true', 
caption:'eBay-Kategorien' 
}); 

데이터 예 :

{ 
"site_id":"0", 
"cat_version":"114", 
"cat_id":"20081", 
"cat_level":"1", 
"name":"Antiques", 
"parent_id":"20081", 
"leaf_category":"0", 
"in_use":"0", 
"id":"20081", 
"level":0, 
"parent":"null", 
"isLeaf":"false", 
"expanded":"false" 
}, 
{ 
"site_id":"0", 
"cat_version":"114", 
"cat_id":"260", 
"cat_level":"1", 
"name":"Stamps", 
"parent_id":"260", 
"leaf_category":"0", 
"in_use":"0", 
"id":"260", 
"level":0, 
"parent":"null", 
"isLeaf":"false", 
"expanded":"false" 
}, 
{ 
"site_id":"0", 
"cat_version":"114", 
"cat_id":"181423", 
"cat_level":"2", 
"name":"Africa", 
"parent_id":"260", 
"leaf_category":"0", 
"in_use":"0", 
"id":"181423", 
"level":1, 
"parent":"260", 
"isLeaf":"false", 
"expanded":"false" 
}, 

많은 테스트를 거쳤지만 해결책을 찾을 수 없습니다 ... 내가 뭘 잘못하고 어떻게 해결할 수 있습니까?

Answer 1

게시 한 JSON 데이터는 해당 사진에 해당하지 않습니다. JSON 데이터 나 그림을 업데이트 할 수 있습니까? 문제를 재현하는 데모 (예 : jsfiddle)를 준비하는 것이 좋습니다. 입력에 항목이있는 경우 그림에 해당하는 일반적인 오류가 잘못된 순서입니다. jqGrid (및 free jqGrid)는 입력 노드의 순서 (url에서 반환 됨)가 정확히 확장 된 항목과 일치해야합니다. jqGrid가 TreeGrid의 노드를로드하고 동일한 순서로 배치한다는 것을 이해하는 것이 중요합니다. 그런 다음 은 모든 자식과 함께 접힌 노드를 숨 깁니다.

나는 "우표"노드의 자식 대신 "우표"후 후 "비디오 게임 & 콘솔"있다고 가정합니다. 로드 된 항목의 순서를 확인하고 수정해야합니다.

불필요한 숨겨진 id 열을 추가로 제거하는 것이 좋습니다. height:'auto', autowidth:false 및 gridview:true 옵션은 무료 jqGrid의 기본값이며 제거 할 수 있습니다. 옵션 pager:'#pager'은 TreeGrid에 대한 일반적으로 필요하지 않습니다,하지만 당신은 당신이 pager:'#pager'pager: true로 변경 불필요한 빈 <div id="pager"></div>를 제거하고 navGrid 또는 inlineNav에 '#pager'를 건너 뛸 수 있습니다 예를 들어, navGrid을 위해 필요합니다. 무료 jqGrid는 호출기 div를 자동으로 생성하며 navGrid 또는 inlineNav도 자동으로 호출기를 사용합니다.