docs - Cómo depurar URL de la tienda Extjs: ruta con Firebug?

extjs docs

Question

Estoy usando el ejemplo de diseño del navegador para mi aplicación.

Estoy tratando de agregarle una red de árbol . Definí una nueva clase, pero cuando llamo a mi cuadrícula de árbol puedo ver la cuadrícula pero no hay datos dentro.

Lo que intento hacer es definir la cuadrícula de árbol en un archivo separado. Mi archivo principal es el layout-browser.js y necesito agregar esto (y otros) en las pestañas que tengo en él. ¿Qué podría estar haciendo mal?

aquí está mi código:

Ext.require([
''Ext.data.*'',
''Ext.grid.*'',
''Ext.tree.*''
]);

Ext.define(''Task'', {
    extend: ''Ext.data.Model'',
    fields: [
        { name: ''task'', type: ''string'' },
        { name: ''user'', type: ''string'' },
        { name: ''duration'', type: ''string'' }
    ]
});

var store = Ext.create(''Ext.data.TreeStore'', {
    model: ''Task'',
    proxy: {
        type: ''ajax'',
        //the store will get the content from the .json file
        url: ''treegrid.json''
    },

    folderSort: true
});



var tree = new Ext.tree.Panel({
title: ''Core Team Projects'',
store : store,

columns:[
{
    header: ''Task'',
    dataIndex: ''task'',
    width: 80
},{
    header: ''Duration'',
    width: 80,
    dataIndex: ''duration'',
    //align: ''center'',
    //sortType: ''asFloat''

},{
    header: ''Assigned To'',
    width: 80,
    dataIndex: ''user''
}] 
});


Ext.define("Ext.app.myTreeGrid", {
    extend: "Ext.panel.Panel",


width: 300,
height : 300,
items: [tree]

});

gracias por tu tiempo y ayuda

Answer 1

var store = Ext.create(''Ext.data.TreeStore'', {
proxy:{
    type: ''ajax'',
    url: ''myTree.json'',
},
reader:{
    type: ''ajax'',
    root: ''nodes'',
    record: ''leaf''
 }  
}); 


var myTree = Ext.create(''Ext.tree.Panel'', {
    store: store,
    rootVisible: false,  
    border: false,
    renderTo:Ext.getBody() //missing

});  

JSON

  {

    children: [
        { text:"Clients", expanded: true,
            children: [{ text:"MAIN", leaf: true }]
        }
    ]
  }

¡Aquí hay un ejemplo de trabajo, puedes definir myTree y llamarlo en tu diseño de navegador!

Vaya a la consola de Firebug NET, actualice la página y busque treeGrid.json,

Pase el mouse por encima para ver la URL completa

Actualice la tienda con la ruta correcta desde la tienda local a una carpeta con su .json


¡Probar ahora!