最近需要实现对treeGrid的查询功能,具体查询界面如下:
可以查询根节点和具体子节点的信息,开始使用EasyUI的TreeGrid的loadData 加载url的方式不能实现查询功能,于是利用异步AJAX查询了一下数据返回后,赋值给变量,然后利用
TreeGrid的loadData加载这个json格式的返回结果实现了对TreeGrid的查询功能,代码如下:
<span class = "pln" > </span><span class = "kwd" > function </span><span class = "pln" > searchROM</span><span class = "pun" >()</span><span class = "pln" > </span><span class = "pun" >{</span><span class = "pln" > </span><span class = "kwd" > var </span><span class = "pln" > product </span><span class = "pun" >=</span><span class = "pln" > $</span><span class = "pun" >(</span><span class = "str" > '#Product' </span><span class = "pun" >).</span><span class = "pln" >combobox</span><span class = "pun" >(</span><span class = "str" > 'getValue' </span><span class = "pun" >);</span><span class = "pln" > </span><span class = "kwd" > var </span><span class = "pln" > keytype </span><span class = "pun" >=</span><span class = "pln" > $</span><span class = "pun" >(</span><span class = "str" > '#keytype' </span><span class = "pun" >).</span><span class = "pln" >combobox</span><span class = "pun" >(</span><span class = "str" > 'getValue' </span><span class = "pun" >);</span><span class = "pln" > </span><span class = "kwd" > var </span><span class = "pln" > keywords </span><span class = "pun" >=</span><span class = "pln" > $</span><span class = "pun" >(</span><span class = "str" > '#keywords' </span><span class = "pun" >).</span><span class = "pln" >val</span><span class = "pun" >();</span><span class = "pln" > </span><span class = "kwd" > var </span><span class = "pln" > url </span><span class = "pun" >=</span><span class = "pln" > encodeURI</span><span class = "pun" >(</span><span class = "str" > '/GoodsROM/ROMList?product=' </span><span class = "pln" > </span><span class = "pun" >+</span><span class = "pln" > product </span><span class = "pun" >+</span><span class = "pln" > </span><span class = "str" > '&keytype=' </span><span class = "pln" > </span><span class = "pun" >+</span><span class = "pln" > keytype </span><span class = "pun" >+</span><span class = "pln" > </span><span class = "str" > '&keywords=' </span><span class = "pln" > </span><span class = "pun" >+</span><span class = "pln" > keywords</span><span class = "pun" >+</span><span class = "str" > '&' </span><span class = "pun" >+</span><span class = "typ" >Math</span><span class = "pun" >.</span><span class = "pln" >random</span><span class = "pun" >());</span><span class = "pln" > $</span><span class = "pun" >.</span><span class = "pln" >post</span><span class = "pun" >(</span><span class = "pln" >url</span><span class = "pun" >,</span><span class = "pln" > </span><span class = "pun" >{},</span><span class = "pln" > </span><span class = "kwd" > function </span><span class = "pun" >(</span><span class = "pln" >data</span><span class = "pun" >)</span><span class = "pln" > </span><span class = "pun" >{</span><span class = "pln" > </span><span class = "kwd" > var </span><span class = "pln" > d </span><span class = "pun" >=</span><span class = "pln" > data</span><span class = "pun" >;</span><span class = "com" > //返回json格式结果</span><span class="pln"> $</span><span class = "pun" >(</span><span class = "str" > '#grid' </span><span class = "pun" >).</span><span class = "pln" >treegrid</span><span class = "pun" >(</span><span class = "str" > 'loadData' </span><span class = "pun" >,</span><span class = "pln" >d</span><span class = "pun" >);</span><span class = "com" > //加载数据更新treegrid</span><span class="pln"> </span><span class = "pun" >},</span><span class = "pln" > </span><span class = "str" > 'json' </span><span class = "pun" >);</span><span class = "pln" > </span><span class = "pun" >}</span> |
有网友照做,发现显示不出来,他的json数据格式为:
<span class = "pun" >{</span><span class = "str" > "total" </span><span class = "pun" >:</span><span class = "lit" >9</span><span class = "pun" >,</span><span class = "str" > "rows" </span><span class = "pun" >:[{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "1" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "数据融合系统" </span><span class = "pun" >,</span><span class = "str" > "_parentId" </span><span class = "pun" >:</span><span class = "str" > "-1" </span><span class = "pun" >},{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "2" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "统计数据" </span><span class = "pun" >,</span><span class = "str" > "_parentId" </span><span class = "pun" >:</span><span class = "str" > "1" </span><span class = "pun" >},{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "3" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "全业务套餐发展量" </span><span class = "pun" >,</span><span class = "str" > "_parentId" </span><span class = "pun" >:</span><span class = "str" > "2" </span><span class = "pun" >},{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "4" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "状态统计查询" </span><span class = "pun" >,</span><span class = "str" > "_parentId" </span><span class = "pun" >:</span><span class = "str" > "2" </span><span class = "pun" >},{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "5" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "装拆机统计查询" </span><span class = "pun" >,</span><span class = "str" > "_parentId" </span><span class = "pun" >:</span><span class = "str" > "2" </span><span class = "pun" >},{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "6" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "产品(分客户群)装拆机统计" </span><span class = "pun" >,</span><span class = "str" > "_parentId" </span><span class = "pun" >:</span><span class = "str" > "2" </span><span class = "pun" >},{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "7" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "清单" </span><span class = "pun" >,</span><span class = "str" > "_parentId" </span><span class = "pun" >:</span><span class = "str" > "1" </span><span class = "pun" >},{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "8" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "子项一" </span><span class = "pun" >,</span><span class = "str" > "_parentId" </span><span class = "pun" >:</span><span class = "str" > "7" </span><span class = "pun" >},{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "9" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "子项二" </span><span class = "pun" >,</span><span class = "str" > "_parentId" </span><span class = "pun" >:</span><span class = "str" > "7" </span><span class = "pun" >}]}</span> |
问题出在treegrid支持的Json格式,根节点没有_parentId,应该如下格式:
<span class = "pun" >{</span><span class = "str" > "total" </span><span class = "pun" >:</span><span class = "lit" >9</span><span class = "pun" >,</span><span class = "str" > "rows" </span><span class = "pun" >:[{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "1" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "数据融合系统" </span><span class = "pun" >},{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "2" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "统计数据" </span><span class = "pun" >,</span><span class = "str" > "_parentId" </span><span class = "pun" >:</span><span class = "str" > "1" </span><span class = "pun" >},{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "3" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "全业务套餐发展量" </span><span class = "pun" >,</span><span class = "str" > "_parentId" </span><span class = "pun" >:</span><span class = "str" > "2" </span><span class = "pun" >},{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "4" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "状态统计查询" </span><span class = "pun" >,</span><span class = "str" > "_parentId" </span><span class = "pun" >:</span><span class = "str" > "2" </span><span class = "pun" >},{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "5" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "装拆机统计查询" </span><span class = "pun" >,</span><span class = "str" > "_parentId" </span><span class = "pun" >:</span><span class = "str" > "2" </span><span class = "pun" >},{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "6" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "产品(分客户群)装拆机统计" </span><span class = "pun" >,</span><span class = "str" > "_parentId" </span><span class = "pun" >:</span><span class = "str" > "2" </span><span class = "pun" >},{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "7" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "清单" </span><span class = "pun" >,</span><span class = "str" > "_parentId" </span><span class = "pun" >:</span><span class = "str" > "1" </span><span class = "pun" >},{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "8" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "子项一" </span><span class = "pun" >,</span><span class = "str" > "_parentId" </span><span class = "pun" >:</span><span class = "str" > "7" </span><span class = "pun" >},{</span><span class = "str" > "Identifier" </span><span class = "pun" >:</span><span class = "str" > "9" </span><span class = "pun" >,</span><span class = "str" > "Area_Name" </span><span class = "pun" >:</span><span class = "str" > "子项二" </span><span class = "pun" >,</span><span class = "str" > "_parentId" </span><span class = "pun" >:</span><span class = "str" > "7" </span><span class = "pun" >}]}</span> |