Dudas TreePanel+Treenode setActiveItem +Panel layout type card
Hola que tal tebgo la siguiente duda es acerca del uso del treepanel al dar clic o seleccionar un nodo quiero que en mi panel de contenido se active un panel card-x,donde yo le especifique x numero en mi nodo ,tengo es te codigo:
Ext.onReady( function() {
//modelado de datos eqiv a Ext.Modelreg
var example = Ext.data.Record.create([
{name: 'title'},
{name: 'description'},
{name: 'url'}
]);
//el lector del xml
var reader = new Ext.data.XmlReader({
record: "Item"
}, example);
// datastore aqui guardamos la informacion
var store = new Ext.data.Store({
storeId: 'store',
url: 'docs/example.xml',
reader: reader
});
store.load();
//console.log(store);
var myTpl = new Ext.XTemplate(
'',
'',
'{title}',
'',
'{description}',
'',
''
);
var captura = Ext.data.Record.create([
{name: 'title'},
{name: 'description'},
{name: 'url'}
]);
//el lector del xml
var readercaptura = new Ext.data.XmlReader({
record: "Item"
}, captura);
// datastore aqui guardamos la informacion
var storecaptura = new Ext.data.Store({
storeId: 'store',
url: 'docs/captura.xml',
reader: readercaptura
});
storecaptura.load();
/////////////////////////////////////////////////////////////////////////////
var navHandler = function(direction) {
}
/////////////////////////////////////////////////////////////////////////////
var treedata = {
text:'Contenido',
children:[
{
text:'Bienvenido al Sistema Irabazi',
iconCls:'folder',
children:[
{id:'1' ,text:'Sistema Irabazi',leaf:true},
{id:'2' ,text:'Sistema de Ayuda',leaf:true}]
},{
text:'Administracion',
iconCls:'folder',
children:[
{text:'Imprime Codigo Cedi',leaf:true},
{text:'Imprime Codigos Operativos',leaf:true},
{text:'Imprime Hojas de Sku',leaf:true}]
},{
text:'Almacen',
iconCls:'folder',
children:[
{text:'Captura Salida Autoventa',leaf:true},
{text:'Captura Salida Preventa',leaf:true},
{text:'Carga Autoventa',leaf:true},
{text:'Confirmacion de Inventario',leaf:true},
{text:'Hoja de Carga Autoventa',leaf:true},
{text:'Hoja de Carga Preventa',leaf:true},
{text:'Inventario',leaf:true},
{text:'Reimprime Carga Preventa',leaf:true},
{text:'Subir Inventario Fisico',leaf:true}]
},{
text:'Caja',
iconCls:'folder',
children:[
{text:'Carga a Bordo De Cedi',leaf:true},
{text:'Liquidacion Autoventa',leaf:true},
{text:'Liquidacion Entrega',leaf:true}]
},{
text:'Inactivos',
iconCls:'folder',
children:[
{text:'Captura Mostrador',leaf:true},
{text:'Listado Revision Preventa',leaf:true}]
},{
text:'Operaciones',
iconCls:'folder',
children:[
{text:'Corte del Dia',leaf:true},
{text:'Depositos Diarios',leaf:true},
{text:'Distribuye Pedidos Mapa',leaf:true},
{text:'Distribuye Pedidos Sistema',leaf:true},
{text:'Hoja de Reparto',leaf:true},
{text:'Liquidados Autoventa',leaf:true},
{text:'No Liquidados Autoventa',leaf:true},
{text:'No Liquidados Preventa',leaf:true},
{text:'Obsequios',leaf:true},
{text:'Proceso Brigadas',leaf:true},
{text:'Remesas',leaf:true},
{text:'Revision de Entregas',leaf:true},
{text:'Revision de Entregas(old)',leaf:true}]
},{
text:'Reportes',
iconCls:'folder',
children:[
{text:'Analisis de Frecuencia',leaf:true},
{text:'Diario de Autoventa',leaf:true},
{text:'Diario de Operaciones',leaf:true},
{text:'Diario de Preventa',leaf:true},
{text:'Frecuencia de Recompra',leaf:true},
{text:'Historial de Compra',leaf:true},
{text:'Montos de Rutas Liquidadas',leaf:true},
{text:'Montos de Rutas No Liquidadas',leaf:true},
{text:'Reporte Acumulado de Promociones',leaf:true},
{text:'Reporte Acumulado de Ventas',leaf:true},]
},{
text:'Sistemas',
iconCls:'folder',
children:[
{text:'Alta/Edicion de Clientes',leaf:true},
{text:'Archivos Scanner(subir scanner)',leaf:true},
{text:'Cambia Ubicacion de Clientes',leaf:true},
{text:'Captura Manual de Pedido',leaf:true},
{text:'Captura Manual de Pedido(old)',leaf:true},
{text:'Hoja de Recorrido Autoventa',leaf:true},
{text:'Hoja de Recorrido Preventa',leaf:true},
{text:'Mapeo de Cliente',leaf:true},
{text:'Revision Autoventa',leaf:true},
{text:'Revision Preventa',leaf:true},
{text:'Software del Scanner',leaf:true}]
},{
text:'Supervision',
iconCls:'folder',
children:[
{text:'Supervision Autoventa',leaf:true},
{text:'Supervision Preventa',leaf:true}]
},
{
text:'Kira Kuchiki',
iconCls:'darkhero',
leaf:true
}
]
} ;
var tree = new Ext.tree.TreePanel({
border: false,
id:'tree',
title:'Contenido',
collapsible:true,
autoScroll:true,
region:'west',
width: 188,
root: treedata ,
listeners:{
click: function(node) {
switch( node)
{
case 1:
console.log(Ext.getCmp('cards').layout.setActiveItem(1));
break;
case 2:
Ext.getCmp('cards').layout.setActiveItem(0);
break;
}
}
}
});
///////////////////////////////////////////////////////////////////////////////////////////////
var panel = new Ext.Panel({
region:'west',
title:'1',
width: 100,
html : '',
});
var ex = new Ext.Panel({
id : 'card 0',
tpl: myTpl,
items: new Ext.DataView({
store : store,
tpl: myTpl,
autoHeight:true,
emptyText: 'No images to display'
})
});
var captura = new Ext.Panel({
id : 'card 1',
tpl: myTpl,
items: new Ext.DataView({
store : storecaptura,
tpl: myTpl,
autoHeight:true,
emptyText: 'No images to display'
})
});
var panel2 = new Ext.Panel({
id : 'cards',
region:'center',
layout:'card',
layoutOnCardChange :true,
width: 100,
activeItem: 0,
items:[ ex , captura ]
});
//console.log(panel2);
//x = console.log(Ext.getCmp('cards').layout.setActiveItem(1));
//console.log(x);
var win = new Ext.Window({ //step 3
title:'Sistema de Ayuda',
layout:'border',
width:570,
height:320,
items: [tree,panel2 ]
});
win.show();
});
al dar clic me sale el siguiente error en mi firebug:
Ext.get("cards").layout.setActiveItem is not a function
[Interrumpir en este error] Ext.get('Panel2').setActiveItem(0);
solucionado uso otro metodo mr Crysfel el problema era el metodo que yo usaba se tenia que activar a traves de algun evento siendo que en mi treepanel agregaba el listener para verificar el nodo y activar cierta carta
incluso si agrego esta linea fuera sin dar clic en el nodo del tree
panel2.setActiveItem();
me sale con que no esta definida siendo este metodo definido en la api muestra la consola lo sig:
panel2.setActiveItem is not a function
[Interrumpir en este error] panel2.setActiveItem(1);
en el foro de Ext JS Sencha ponen esta linea como ejemplo
Ext.getCmp('cards').layout.setActiveItem(1)
yo lo pongo cambiandole el id a mi panel2 por este y me dice que no es funcion pero al escribirlo en la consola del firebug hace sus cambios
¿Conoces a alguien que pueda responder esta pregunta? Comparte el link en Twitter o Facebook
Es necesario registrarse para poder participar en el foro! Si ya tienes una cuenta puedes entrar y comentar en este foro.