几年之前写过一个非常简单的jqgrid属性说明。
今天又用到jqgrid这个控件了，捣鼓了许久，第一个treegrid完成了
1 jQuery("#list1").jqGrid({
2 url: 'NBuilding.aspx?oper=GetTreeJson&t=' + new Date().getTime(),
3 treedatatype: "json",
4 datatype: 'json',
5 mtype: "POST",
6 colNames: ["ID", "代码", "名称", "列1"],
7 colModel: [
8 { name: 'id', index: 'id', width: 50, hidden: true, key: true },
9 { name: 'dm', index: 'dm', width: 50, align: "center" },
10 { name: 'mc', index: 'mc', width: 180 },
11 { name: 'dd', index: 'dd', align: "center" }
12 ],
13 height: $(".Content").height() - 25,
14 width: $(".Content").width() - 5,
15 treeGrid: true,//启用树型Grid功能
16 treeGridModel: 'adjacency',//表示返回数据的读取类型，分为两种：和adjacency
17 ExpandColumn: 'mc',//树型结构在哪列显示
18 caption: ""
19 });上面这是主要的js代码
特别要说明的是treeGridModel分为两种：nested和adjacency；默认值：nested
再看一下使用adjacency方式,服务器返回的JSON数据
1 {
2 "total": 12,
3 "records": 1,
4 "page": 1,
5 "rows": [
6 {
7 "id": 1,
8 "cell": [
9 1,
10 "QY0001",
11 "南开区",
12 0,
13 0,
14 0,
15 false,
16 true,
17 true
18 ]
19 },
20 {
21 "id": 4,
22 "cell": [
23 4,
24 "LY0007",
25 "集团",
26 0,
27 1,
28 1,
29 false,
30 false,
31 true
32 ]
33 },
34 {
35 "id": 6,
36 "cell": [
37 6,
38 "LC0006",
39 "办公地点二",
40 0,
41 2,
42 4,
43 false,
44 false,
45 true
46 ]
47 },
48 {
49 "id": 7,
50 "cell": [
51 7,
52 "FJ0013",
53 "201",
54 0,
55 3,
56 6,
57 false,
58 false,
59 true
60 ]
61 },
62 {
63 "id": 10,
64 "cell": [
65 10,
66 "XL0014",
67 "电脑办公",
68 0,
69 4,
70 7,
71 true,
72 false,
73 true
74 ]
75 },
76 {
77 "id": 8,
78 "cell": [
79 8,
80 "FJ0014",
81 "202",
82 0,
83 3,
84 6,
85 false,
86 false,
87 true
88 ]
89 },
90 {
91 "id": 11,
92 "cell": [
93 11,
94 "XL0015",
95 "机房空调",
96 0,
97 4,
98 8,
99 true,
100 false,
101 true
102 ]
103 },
104 {
105 "id": 2,
106 "cell": [
107 2,
108 "QY0003",
109 "西青区",
110 28.5,
111 0,
112 0,
113 false,
114 true,
115 true
116 ]
117 },
118 {
119 "id": 3,
120 "cell": [
121 3,
122 "LY0006",
123 "A座",
124 28.5,
125 1,
126 2,
127 false,
128 false,
129 true
130 ]
131 },
132 {
133 "id": 5,
134 "cell": [
135 5,
136 "LC0005",
137 "办公地点三",
138 28.5,
139 2,
140 3,
141 false,
142 false,
143 true
144 ]
145 },
146 {
147 "id": 9,
148 "cell": [
149 9,
150 "XL0013",
151 "测试表（.252）",
152 14.9,
153 3,
154 5,
155 true,
156 false,
157 true
158 ]
159 },
160 {
161 "id": 12,
162 "cell": [
163 12,
164 "XL0017",
165 "两块表同时测试",
166 13.6,
167 3,
168 5,
169 true,
170 false,
171 true
172 ]
173 }
174 ]
175 }
仔细观察在cell数组，我们只定义了4列，非treeGrid时我们返回4列就可以了
但是在adjacency方式我们需要在原本的4列数据之后再增加如下字段数据来支持TreeGrid
adjacency方式：
列 | 解释 |
level_field | 节点的级别，默认最高级为0 |
parent_id_field | 该行数据父节点的id |
leaf_field | 是否为叶节点，为true时表示该节点下面没有子节点了 |
expanded_field | 是否默认展开状态 |
loaded_field | 是否已经加载过子节点（为false时点击节点会自动加载子节点） |
icon_field | 图标 |
nested方式：
列 | 解释 |
level_field | 节点的级别，默认最高级为0 |
left_field | 用来确定这个节点的子节点ID开始数 |
right_field | 用来确定这个节点的子节点ID结束数 |
lead_field | 是否为叶节点，为true时表示该节点下面没有子节点了 |
expanded_field | 是否默认展开状态 |
loaded_field | 是否已经加载过子节点（为false时点击节点会自动加载子节点） |
icon_field | 图标 |
