Extjs4.2.1 - 加载json到treepanel失败 [英] Extjs4.2.1 - Load json to treepanel fails

问题描述

我创建一个treepanel和我创建商店像

I create a treepanel and I and create store like

          var store = Ext.create('Ext.data.TreeStore', {
            autoload: false,
            proxy: {
                type: 'ajax',
                url: 'data.php',
                reader: {
                    type: 'json',
                    root: 'results'                 
                }
            }
          });

我的服务器打印json看起来像

my server print json look like

{ "results": 
    [
    { id : '1' , text : '1', expanded: true, 
        children :[
            { id : '5' , text : '5', leaf:true},
            { id : '6' , text : '6', leaf:true}
        ]
    },
    { id : '2' , text : '2', leaf:true},
    { id : '3' , text : '3', leaf:true},
    { id : '4' , text : '4', leaf:true},
    { id : '7' , text : '7', leaf:true},
    { id : '8' , text : '8', leaf:true},
    { id : '9' , text : '9', leaf:true},
    { id : '10' , text : '10', expanded: true, 
        children :[
            { id : '11' , text : '11', leaf:true},
            { id : '12' , text : '12', leaf:true}
        ]
    }
    ]
}

但是当我运行我的代码时，我会看到火错误，总是运行 GET http：//localhost/example/data.php ... 永不停止：（

But when i run my code, i see firebug and that always run GET http://localhost/example/data.php... never stop :(

和我的树被添加了这么多双重

and my tree is added so much double

如何修复感谢

编辑

在实际中，我用别名定义我的treepanel，并使用它作为 xtype

但是我创建新的例子并获得同样的问题。
这是我的js

Edit
In real i define my treepanel with alias and using it as xtype
But i create new example and get same problem. Here is my js

var store = Ext.create('Ext.data.TreeStore', {
            autoload: false,
            proxy: {
                type: 'ajax',
                url: 'data.php',
                reader: {
                    type: 'json',
                    root: 'results'                 
                }
            }
        });

        Ext.create('Ext.tree.Panel', {
            title: 'Simple Tree',
            width: 200,
            height: 150,
            store: store,
            rootVisible: false,
            renderTo: Ext.getBody()
        });

这里是我的 data.php / p>

And here is my data.php

echo "
{
    'success': true, 
    'variable': 100, 
    'results': 
    [
    { id : '1' , text : '1', expanded: true, 
        children :[
            { id : '5' , text : '5', leaf:true},
            { id : '6' , text : '6', leaf:true}
        ]
    },
    { id : '2' , text : '2', leaf:true},
    { id : '3' , text : '3', leaf:true},
    { id : '4' , text : '4', leaf:true},
    { id : '7' , text : '7', leaf:true},
    { id : '8' , text : '8', leaf:true},
    { id : '9' , text : '9', leaf:true},
    { id : '10' , text : '10', expanded: true, 
        children :[
            { id : '11' , text : '11', leaf:true},
            { id : '12' , text : '12', leaf:true}
        ]
    }
    ]
}";

推荐答案

你在这里有一些我认为是树木中的错误。当您更改读者以使用不是 children 的根时，您还需要将数据中的children属性名称的每个实例都更改为新名称。这意味着如果要将根更改为结果，那么您的树数据实际上必须如下所示：

What you have here is something I consider to be a bug in the treestore. When you change the reader to use a root that isn't children, you also need to change every instance of the children property name in the data to the new name too. That means if you want to change the root to results, your tree data would actually have to look something like this:

echo "
{
    'success': true, 
    'variable': 100, 
    'results': 
    [
    { 'id' : '1' , 'text' : '1', 'expanded': true, 
        'results':[
            { 'id' : '5' , 'text' : '5', 'leaf':true},
            { 'id' : '6' , 'text' : '6', 'leaf':true}
        ]
    },
    { 'id' : '2' , 'text' : '2', 'leaf':true},
    { 'id' : '3' , 'text' : '3', 'leaf':true},
    { 'id' : '4' , 'text' : '4', 'leaf':true},
    { 'id' : '7' , 'text' : '7', 'leaf':true},
    { 'id' : '8' , 'text' : '8', 'leaf':true},
    { 'id' : '9' , 'text' : '9', 'leaf':true},
    { 'id' : '10' , 'text' : '10', 'expanded': true, 
        'results':[
            { 'id' : '11' , 'text' : '11', 'leaf':true},
            { 'id' : '12' , 'text' : '12', 'leaf':true}
        ]
    }
    ]
}";

另一个选项是更改顶级结果属性名称为 children ，并将商店的根标记为 children 。

The other option is to change the top level results property name to children and mark the root of your store as children.

这篇关于Extjs4.2.1 - 加载json到treepanel失败的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！