2014-10-23 2 views
0

일부 계층 적 데이터를 표시하기 위해 Jqgrid Treegrid를 사용하고 있습니다. 노드에 연결된 일부 라인을 통해 부모 - 자식 링크를 보여주는 기능이있는 두 개의 다른 트리 구현을 보았습니다. 하나 이러한 구현 JQuery와 Jeasyui 라이브러리입니다, 당신은 here This is a ref image부모 자식 링크를 표시하는 Jqgrid 트리 그리드 노드 연결선

둘째 다소 비슷한 구현 Tabelizer - here
a sample view of table level lines

이제 문제는 우리가있는 jqGrid의 TreeGrid에이 기능을 구현하는 방법입니다 찾을 수 있습니까?

각 행의 시작 부분에 클래스가 "tree-wrap tree-wrap-ltr"인 div가 있으며, 각 수준 아래에 style = "width : 18px;"가 있습니다. 각 수준에서 18px를 계속 추가합니다.

Means level 0 style=width:18px 
levle 1 style=width:36px 
level 2 style=width:54px 

그래서 나는 각 사업부 통과 차례로 수준의 커넥터로 볼 수있는 몇 가지 경계 속성을 추가 할 수 있습니다 어쩌면 몇 가지 멋진 JS 루프를 생각

. catch는 노드가 마지막 자식 일 때와 아래 노드가 여러 줄을 병렬로 흐르게하는 형제 노드 일 때 검사합니다.

더 좋은 아이디어가 있습니까?

답변

0

jqGrid는옵션의 경우 right 옵션의 경우 div의 left 속성을 사용하여 TreeGrid 항목 앞에 아이콘을 배치합니다. 모든 레벨의 폭은 18px입니다 (the part of code 참조). 그래서 어떤 귀하의 요구 사항을 구현하는 쉬운 방법을 볼 수 없습니다.

<div> 또는 필요한 왼쪽 모습이있는 배경 이미지를 추가해보십시오. 그러나보기가 쉽지는 않을 수 있습니다. 행 확장/축소시 아이콘/이미지를 변경해야합니다. 불행히도 jqGrid는 확장/축소시 추가적인 콜백/이벤트를 제공하지 않습니다. 따라서 메소드를 "서브 클래스 화"해야합니다. 해당 코드 예제는 the answer을 참조하십시오. 어떤면에서든 필요한 동작을 구현하는 것이 쉽지는 않을 것이며 요구 사항이 프로젝트에서별로 중요하지 않은 경우이 작업을 시작하지 않는 것이 좋습니다.

+0

의견에 감사드립니다. 나는 또한이 문제에 대한 내 머리카락을 잡아 당기고 있었고 Jqgrid의 핵심을 해킹하는 것 외에는 현명한 방법을 찾지 못했습니다. 나는 네가 옳은 것 같아, 나는이 기능을 미래의 프로젝트에 전달할 것이다. – Ali