No se activa el tab
Hola amigos tengo el siguiente problema: En aplicación tengo un área donde muestro un Tabpanel que por defecto carga un Tab, y después dinámicamente le voy agregando mas tabs a este contenedor, ahora que sucede que cuando cierro los tabs que cree dinámicamente el tab que estaba por defecto no se activa. adjunto el código para ayuda.
Ext.ns('app'); Ext.ux.IFrameComponent = Ext.extend(Ext.BoxComponent, { onRender : function(ct, position){ this.el = ct.createChild({tag: 'iframe', id: 'iframe-'+ this.id, frameBorder: 0, src: this.url}); } }); Ext.onReady(function() { //Para mostrar los avisos de validación Ext.QuickTips.init(); // turn on validation errors beside the field globally Ext.form.Field.prototype.msgTarget = 'side'; Ext.state.Manager.setProvider(new Ext.state.CookieProvider()); //Generamos el viewport var viewport = new Ext.Viewport({ layout:'border', items: [app.navigation,app.tabpanel,app.header] }); }); app.navigation = { title: 'Administracion', region: 'west', id:'navigation', split:true, border:true, width: 175, minSize: 175, maxSize: 400, margins:'2 0 3 3', collapsible: true, collapsedTitle: true, //layout:'accordion', layout:'border', //layout:'fit', layoutConfig:{ animate:true }, items:[app.menu] } app.menu = { id:'menu', xtype: 'treepanel', region:'center', autoScroll:true, title:'Menú', iconCls:'nav', rootVisible: false, border:false, lines: false, singleExpand: false, useArrows: true, listeners: { click : { scope : this, fn : function(n,e) { if(n.leaf) { //Accedemos a los a atributod del json que usamos para crear el nodo con if (n.attributes.url) { url = n.attributes.url; } else { url = n.id; } app.addTabPostComprobacion(n.id,n.text,url,n.attributes.tabType); } } } }, loader: new Ext.tree.TreeLoader({ dataUrl:'/js/comunes/app.tree.js' }), root: new Ext.tree.AsyncTreeNode({ expanded :true }) } ///Mi arbol de navegación [{ text:'Usuarios', expanded:false, iconCls:'menu_usuarios', children:[{ id : 'formulario', tabType:'load', url:'usuario', text:'Usuario', iconCls:'user_add', leaf:true },{ id : 'register', tabType:'load', url:'usuario/Register', text:'Registrar', iconCls:'user_add', leaf:true }] }] //Mi contenedor de Tabs con el que cargo por defecto app.mytabpanel = Ext.extend(Ext.TabPanel, { initComponent: function(){ app.mytabpanel.superclass.initComponent.apply(this, arguments); } }); // register xtype to allow for lazy initialization Ext.reg('mytabpanel', app.mytabpanel); app.tabpanel = new Ext.TabPanel({ id: 'tabs', border:false, activeItem: 0, region:'center', margins: '2 3 3 0', autoScroll:true, enableTabScroll:true, items:[{ id:'cuadro_inicio', closable:false, layout:'fit', title: 'Inicio', iconCls:'house', autoLoad: {url: 'principal', border:false, scripts: true,scope: this} }] }); //Funcion addPanel app.addTabPostComprobacion = function (id,title,url,type) { //alert(url); var open = !app.tabpanel.getItem(id); if (open) { switch (type) { case 'iframe': //Creamos un nuevo ifram y cargamos dentro la url var newPanel = new Ext.Panel({ id : id, title: title, loadScripts: true, autoScroll: true, closable: true, iconCls:id+'_icon', layout:'fit', items: [ new Ext.ux.IFrameComponent({ id: id, url: url, name: id}) ] }); app.tabpanel.add(newPanel); app.tabpanel.setActiveTab(newPanel); break; case 'load': //Cargamos la pestaña por ajax var newPanel = new Ext.Panel({ id : id, layout: 'fit', title: title, loadScripts: true, closable: true, border:false, autoLoad: { url: url, border:false, scripts: true, scope: this } }); app.tabpanel.add(newPanel); app.tabpanel.setActiveTab(newPanel); break; default: alert("Tipo de tab no definido"); break; } } else { //Si ya tenemos la pestaña creada la seleccionaremos app.tabpanel.setActiveTab(id); } } //aki mando a insertar un tab var nombre = new Ext.form.TextField({ fieldLabel : 'Nombre(s)', name : 'nombre', id:'idnombre', allowBlank : false, maskRe:/^([a-zA-Z0-9áéíóúñüÑ,. ]+ ?[a-zA-Z0-9áéíóúñüÑ,. ]*)+$/, blankText : 'Este campo es obligatorio' }); var papellido=new Ext.form.TextField({ fieldLabel : 'Primer Apellido', name : 'apellido1', id:'idapellido1', allowBlank : false, maskRe:/^([a-zA-Z0-9áéíóúñüÑ,. ]+ ?[a-zA-Z0-9áéíóúñüÑ,. ]*)+$/, blankText : 'Este campo es obligatorio' }); var idformulario= new Ext.FormPanel({ border:false, id: 'formulario', labelAlign : 'top', frame: true, layout: 'form', items:[nombre,papellido], buttonAlign : 'right', buttons :[{ text : 'Aceptar', icon:'add', iconCls:'add', },{ text : 'Cerrar', icon:'remove', iconCls:'remove', }] }); app.tab_insertar=Ext.getCmp('tabs'); app.tab_insertar.add(idformulario); app.tab_insertar.doLayout(); //Inserto otro Tabs <h1>Hola Mundo</h1>
Hola, no se si te servirá de ayuda pero
¿ has probado de seleccionar el tab por defecto en el evento [b]remove[/b] del TabPanel?
¿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.