Threaded View

  1. #1
    Sencha User
    Join Date
    Nov 2011
    Posts
    1
    Vote Rating
    0
    coiso123 is on a distinguished road

      0  

    Exclamation GXT Fill TreeStore with JSON data

    GXT Fill TreeStore with JSON data


    Hi everyone,

    I'm having difficulty filling a tree with data from a json file obtained through http request. I can read the json data and override the hasChildren function from the BaseTreeLoader class so the tree knows which nodes can be expanded. However the children of each node are being filled by the parents creating an infinit tree.

    Does anyone know how to override the loadChildren method from the BaseTreeLoader so that the tree can fill the right children in each node?

    My code:
    Code:
    public static void TreePanel getJSONTreePanelExample() {
            RequestBuilder builder = new RequestBuilder(RequestBuilder.GET, GWT.getModuleBaseURL() + "/data/treedata.json");  
            HttpProxy<ListLoadResult<ModelData>> proxy = new HttpProxy<ListLoadResult<ModelData>>(builder);  
          
            ModelType type = new ModelType();  
            type.setRecordName("items");  
            type.setRoot("result");  
            type.addField("name", "name");  
            type.addField("xtype", "xtype");  
            type.addField("items", "items");  
          
            JsonReader<List<ModelData>> reader = new JsonReader<List<ModelData>>(type);  
          
            TreeLoader<ModelData> loader = new BaseTreeLoader<ModelData>(proxy, reader) {  
    
    
              @Override  
              public boolean hasChildren(ModelData parent) {
                return "folder".equals(parent.get("xtype")); // if xtype prop has 'folder' value
              }
              
              @Override  
              public boolean loadChildren(ModelData parent) {
                    children.add(parent);
                    List<ModelData> resultados=reader.read(parent, parent);
                    onLoadSuccess(parent, resultados); // instead of loadData, no proxy call
                    return true;
              }
    
    
            };  
          
            TreeStore<ModelData> store = new TreeStore<ModelData>(loader);  
          
            final TreePanel<ModelData> tree = new TreePanel<ModelData>(store);  
            tree.setDisplayProperty("name");  
            return tree;
        }
    My JSON file:

    Code:
    {
    result:[
        {
         xtype:'folder',
         name:'Folder 1',
         items:[{
                xtype:'leaf',
                name:'Folder1 Item1',
            },{
                xtype:'leaf',
                name:'Folder1 Item2',
            },{
                xtype:'folder',
                name:'SubFolder1',
                 items:[{
                        xtype:'leaf',
                        name:'SubFolder1 Item1',
                    },{
                        xtype:'leaf',
                        name:'SubFolder1 Item2',
                    }]
            }]
        },
        {
            xtype:'leaf',
            name:'First Level Item',
        }
    ]
    }
    Thanks in advance.
    Last edited by coiso123; 24 Nov 2011 at 4:58 AM. Reason: code error