关于easy-ui 中的treeGrid的数据显示问题


   <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>单位自查自报</title>
    
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">    
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">

<link rel="stylesheet" type="text/css" href="<%=basePath%>css/easy-ui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="<%=basePath%>css/easy-ui/icon.css">

<script type="text/javascript" src="<%=basePath%>js/easy-ui/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="<%=basePath%>js/easy-ui/jquery.easyui.min.js"></script>

<script type="text/javascript">
$(document).ready(function(){
$('#test').treegrid({
title:'TreeGrid',
iconCls:'icon-save',
width:800,
height:350,
animate:true,
collapsible:true,
url:'<%=basePath%>check/check!getCheckTest.action',
idField:'id',
treeField:'code',
frozenColumns:[[
                {title:'编号',field:'code',width:150,
                formatter:function(value){
                 return '<span style="color:red">'+value+'</span>';
                }
                }
]],
columns:[[
{field:'name',title:'Name',width:120},
{field:'addr',title:'Address',width:120,rowspan:2},
{field:'col4',title:'Col41',width:150,rowspan:2}
]]
});
});
</script>
  </head>
  <body>
<table id="test"></table>
</body>
</html>我后台得到的Json数据格式为：   {"total":3,"rows":
[
{"id":1,"code":"01","name":"name1","addr":"address1","col4":"col4data","iconCls":"icon-ok","children":
[
{"id":2,"code":"0101","name":"name11","addr":"address11","checked":true},
{"id":3,"code":"0102","name":"name12","addr":"address12","state":"closed"}
]
},
{"code":"02","name":"Languages abc","addr":"address2","col4":"col4 data","state":"closed","children":
[
{"code":"0201","name":"Java","col4":"col4 data","state":"closed","children":
[
{"code":"1","name":"jdk1"},
{"code":"1","name":"jdk2"}
],
{"code":"0202","name":"C#","col4":"col4data"}
]
}
]
}
哪里出现问题了呢？

解决方案 »

  1.   

    第一，treegrid的数据源是数组，不是object
    第二，你返回的json格式出错了            [
                    {"code":"0201","name":"Java","col4":"col4 data","state":"closed","children":
                        [
                            {"code":"1","name":"jdk1"},
                            {"code":"1","name":"jdk2"}
                        ]},/////////这里少了一个}
                    {"code":"0202","name":"C#","col4":"col4data"}
                ]正确的应该是这样
        [
            { "id": 1, "code": "01", "name": "name1", "addr": "address1", "col4": "col4data", "iconCls": "icon-ok", "children":
                [
                    { "id": 2, "code": "0101", "name": "name11", "addr": "address11", "checked": true },
                    { "id": 3, "code": "0102", "name": "name12", "addr": "address12", "state": "closed" }
                ]
            },
            { "id": 2, "code": "02", "name": "Languages abc", "addr": "address2", "col4": "col4 data", "state": "closed", "children":
                [
                    { "code": "0201", "name": "Java", "col4": "col4 data", "state": "closed", "children":
                        [
                            { "code": "1", "name": "jdk1" },
                            { "code": "1", "name": "jdk2" }
                        ]
                    },
                    { "code": "0202", "name": "C#", "col4": "col4data" }
                ]
            }
        ]
      

  2.   


    我改成你说的那个数组。
      可是，还是一样的情况...你那边有dome么？我是按照官网来写的，还是没出来....
      

  3.   

    不是吧，我就是用你的代码弄的，可以显示，不过数据源我用的是json文件
    data.json
    [
            {"id":1,"code":"01","name":"name1","addr":"address1","col4":"col4data","iconCls":"icon-ok","children":
                [
                    {"id":2,"code":"0101","name":"name11","addr":"address11","checked":true},
                    {"id":3,"code":"0102","name":"name12","addr":"address12","state":"closed"}
                ]
            },
            {"code":"02","name":"Languages abc","addr":"address2","col4":"col4 data","state":"closed","children":
                [
                    {"code":"0201","name":"Java","col4":"col4 data","state":"closed","children":
                        [
                            {"code":"1","name":"jdk1"},
                            {"code":"1","name":"jdk2"}
                        ]},
                    {"code":"0202","name":"C#","col4":"col4data"}
                ]
            }
        ]<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>jQuery EasyUI</title>
    <link rel="stylesheet" type="text/css" href="../themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="../themes/icon.css">
    <script type="text/javascript" src="../jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="../jquery.easyui.min.js"></script>
    <script>
        $(document).ready(function () {
            $('#test').treegrid({
                title: 'TreeGrid',
                iconCls: 'icon-save',
                width: 800,
                height: 350,
                animate: true,
                collapsible: true,
                url: 'data.json',/////////我就改成json文件
                idField: 'id',
                treeField: 'code',
                frozenColumns: [[
                        { title: '编号', field: 'code', width: 150,
                            formatter: function (value) {
                                return '<span style="color:red">' + value + '</span>';
                            }
                        }
                    ]],
                columns: [[
                        { field: 'name', title: 'Name', width: 120 },
                        { field: 'addr', title: 'Address', width: 120, rowspan: 2 },
                        { field: 'col4', title: 'Col41', width: 150, rowspan: 2 }
                    ]]
            });
        });
    </script>
    </head>
    <body>
    <table id="test"></table>
    </body>
    </html>
      

  4.   

    的确是Json数据格式少了个括号....   谢谢