Relayevents sirve para compartir eventos entre componentes, o mejor para comunicar componentes entre si. Por ejemplo quiero que al hacer click en la celda de un grid muestre en un panel su contenido. Creariamos un evento con el nombre que quieras(por ejemplo eventoclick2) para la celda y hariamos los siguiente: panel.relayEvents(celda, ['eventoclick2']); Penel recibe el evento y celda es el que lo comparte, por decirlo de alguna manera, y luego panel.on("eventoclick2",function(param,param2){ //hariamos lo que necesitasemos con los datos }); Para usar esto debes tener claro como añadir , disparar y usar los eventos etc. UNa vez que dominas esto veras que es super util ;), es algo que usaras casi siempre

he alli mi problema, no se como implementarlo correctamente, lo que sucede es que soy nuevo en todo esto, menos en php, lo mio siempre ha sido es servidores, hace poco que he comenzado a practicar/aprender sobre este mundo y bueno pues soy de las personas que aprenden rapido, pero claro con la practica claro esta, no soy de las personas que leen mucho, mas aprendo practicando y luego consulto en libros. Si tubieras unos link con ejemplos o book sobre ese tema te lo agradeceria.

te paso un ejemplo muy sencillo con el que conseguimos que la ventana 1 se comunique con la ventana 2 ;) var ventana1=new Ext.Window({ title: 'Ventana con textfield que comparte evento', width: 400, height: 250, layout: 'fit', items: [{ xtype: 'form', labelAlign: 'top', items: [{ xtype: 'textfield', enableKeyEvents :true, ref:"../texto", listeners:{ 'keypress':{ fn:function(field,e){ var texto= field.getValue(); ventana1.fireEvent("teclea",texto); } } }, fieldLabel: 'Label', anchor: '100%' } ] } ] }); var ventana2=new Ext.Window({ title: 'Ventana recibe el evento', width: 400, height: 250 }); ventana1.addEvents("teclea"); ventana2.relayEvents(ventana1, ['teclea']); ventana2.on("teclea",function(texto){ var html = ''+texto+': '; this.body.update(html); }); ventana1.show(); ventana2.show();

Excelente ejemplo @pasblin =D>

asi es Pasblin y si no hubiera sido por tu ejemplo y el consejo de de Crysfel hasta ahora seguiria en eso, por surte ahora ya es algo mas que se en el amplio mundo de extjs. Gracias.

Gracias a todos Solucionado xD.

me alegro de que hayas conseguido dominar el tema ;), ya que es una utilidad imprescindible(diría yo) en proyectos grandes ;)

humm haber he hehco un ejemplo mas simple y aun asi me sigue sin funcionar este es el JS Ext.ux.realstate.Tree = function(config){ Ext.apply(this, config); this.treeRealstate = new Ext.tree.TreePanel({ border: false, autoScroll:true, dataUrl:BASE_URL + 'realstate/createTree', rootVisible: false }); this.rootRealState = new Ext.tree.AsyncTreeNode({ text: 'Lista de Propiedades' }); this.treeRealstate.setRootNode(this.rootRealState); this.treeRealstate.on('click',function(node){ if(node.leaf != false) { this.fireEvent('showRealState', node); console.log('leaf true'); } else { ///return false; this.fireEvent('showRealState', node); console.log('no leaf'); } }); this.treeRealstate.addEvents( 'showRealState'); Ext.ux.realstate.Tree.superclass.constructor.call(this, { border: false, autoScroll:true, items: [this.treeRealstate] }); }; Ext.extend(Ext.ux.realstate.Tree, Ext.Panel, { }); hasta aqui bien en la consola me bota correctamente el log, ahora en el otro archivo esta asi: Ext.ns("Ext.ux.realstate"); Ext.ux.realstate.MainPanel = function(config){ Ext.apply(this, config); // otro codigo .... // fin otro codigo this.newRealstateWin = new Ext.Button(this.newClientButton); this.TreeRealState = new Ext.ux.realstate.Tree(); this.westPanelClient = new Ext.Panel({ title: 'Panel de Administracion', autoscroll: true, region:'west', border: true, autoScroll:true, split:true, collapseMode:'mini', animate:true, containerScroll: true, minWidth:10, width:250, items:[ new Ext.Panel({ frame: true, border: false, items:[this.newRealstateWin] }), this.TreeRealState] }); Ext.ux.realstate.MainPanel.superclass.constructor.call(this, { border:false, autoScroll:true, layout:'border', items:[ this.westPanelClient, this.content ] }); this.westPanelClient.relayEvents(this.TreeRealState, ['showRealState']); this.westPanelClient.on('showRealState',function(node){ console.log('recibido'); alert('Hola mundo'); }); }; Ext.extend(Ext.ux.realstate.MainPanel, Ext.Panel, { }); Cuando doy click no sale ni el alert ni el recibido en consola.

Gracias Pasblin, el ejemplo es muy claro pero aun asi no he podido hacerlo funcionar Tengo el siguiente archivo: Ext.ns('Ext.ux.clients'); Ext.ux.clients.createNewClient = function(config){ Ext.apply(this, config); var store_c= new Ext.data.JsonStore({ url:BASE_URL + 'clientes/get_typeclient', method: 'put', root: 'data_c', fields: [ {name:'id_typec', type: 'string'}, {name:'name_c', type: 'string'}, ] }); this.cTypeClient = new Ext.form.ComboBox({ fieldLabel:'Tipo Cliente', name:'sTypeClient', forceSelection: true, allowBlank: false, store: this.store_c, emptyText:'Seleccione el tipo de contacto...', triggerAction: 'all', editable:false, displayField:'name_c', valueField: 'id_typec', width: 167 }); this.formularioNuevoCliente = new Ext.form.FormPanel({ url: BASE_URL + 'clientes/new_client', border:false, labelWidth: 80, defaults: { xtype:'textfield', width: 200 }, items:[ {fieldLabel:'Nombres',name:'userdb_user_first_name', allowBlank:false}, {fieldLabel:'Apellidos',name:'userdb_user_last_name', allowBlank:false}, {fieldLabel:'E-mail',name:'userdb_emailaddress', allowBlank:false, vtype: 'email'}, this.cTypeClient, {xtype:'numberfield',fieldLabel:'Telefono',name:'userdb_phone'}, {xtype:'numberfield',fieldLabel:'Celular',name:'userdb_mobile'}, {xtype:'numberfield',fieldLabel:'Fax',name:'userdb_fax'}, {fieldLabel:'Web',name:'userdb_web'}, {xtype:'textarea',fieldLabel:'Comentario',name:'homepage'} ] }); Ext.ux.clients.createNewClient.superclass.constructor.call(this, { title: 'Ingresar Cliente/Contacto', region: 'west', split: true, margins:'3 0 3 3', cmargins:'3 3 3 3', items: [this.formularioNuevoCliente], buttons: [{ text:'Grabar', handler: function(){ sendData(); } },{ text:'Cancelar', handler: function(){ cierra(); } }] }); this.addEvents('cierralo'); }; Ext.extend(Ext.ux.clients.createNewClient, Ext.Window, { cierra: function() { this.fireEvent('cierralo','Estamos cerrando esta ventana xD'); } }); y lo llamo desde otro archivo. Ext.ns("Ext.ux.realstate"); include(BASE_URL+'assets/modules/realstate/js/newrealstate.js',{type:'js',dom:true,cache:true}); Ext.ux.realstate.MainPanel = function(config){ Ext.apply(this, config); // resto de cogido openCreateNewClient = new Ext.ux.clients.createNewClient(); this.relayEvents(openCreateNewClient, ['cierralo']); en la funcion cierralo hago un simple alert pero aun asi no funciona :s que puedo estar haciendo mal? Gracias.

;-)

Excelente, no había visto que podía hacer eso, genial!