Foro

Ejecutar codigo ExtJS en la API Documentation de EXTJS

0
Acabo de descargarme la nueva version de ExtJS que ahora veo que se llama Sencha y revisando la documentacion (Ext JS Api Documentation) me surge una duda que hasta ahorita no he podido resolver (realmente llevo mas de 2 horas sin obtener el resultado deseado). Primero veamos la Imagen 1, del lado izquierdo se encuentra el Tree y del lado derecho se muestra el contenido del item al que se le hizo click. Ya logre agregar un item al Tree, modificando el Tree.js en cuestion, y al hacerle click se me muestra la pagina del lado derecho. Lo que quisiera saber es como puedo hacer que se ejecute codigo ExtJS en la pagina que se muestra del lado derecho por ejemplo como este ( Imagen 2): Ext.MessageBox.alert('Status', 'Changes saved successfully.'); o algun codigo para formulario, ventanas, grids, etc. De antemano gracias por su ayuda
0
Y no sería mejor crear un componente y luego agragarlo a esa región y hacer una comunicación entre ambos? n se si me parece muy buena ida el tema de iframes ;) Aquí tienes un ejemplo para comunicar componentes: http://foro.quizzpot.com/discussion/848/solutionado-relayevents
0
como mi padre dice "en pedir no hay engaño" asi que no hay problema ;-) imagino que ya tienes tu viewport con tus zonas (south, north, west, east) definidas, no es asi? defines dentro de tu codigo, al principio, tu iframe de la sgte manera: 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}); } }); luego en la funcion o listener donde controlas en que nodo hace clic el usuario colocas lo siguiente: //la seleccion del nodo del arbol menu mitreepanel.addListener('click', function (nodo, e) { if (nodo.id != 'raiz') { //con esto diferencio si se le hizo clic al nodo raiz si lo estas mostrando en tu treepanel if (nodo.attributes.leaf == '1') { //si el nodo es una hoja del arbol entonces llamo al tab var contenido = Ext.getCmp('id_del_tabpanel'); var open = !contenido.getItem(nodo.id); //checas si el tab o pestaña ya existe if (open) { contenido.add({ title: nodo.text, //de la definicion del nodo creas el titulo del tab id: nodo.id, iconCls: nodo.attributes.iconCls, //siempre desde la definicion del nodo y segun tu archivo de estilo le asignas un icono al tab si lo deseas items: [ new Ext.ux.IFrameComponent({ id: nodo.id, url: 'app/' + nodo.attributes.iconCls + '.html', //ruta de tu archivo a cargar dentro del iframe * name: nodo.id, style: 'width:100%;height:100%' })], loadScripts: true, autoScroll: true, closable: true }).show(); return; } tab = contenido.getItem(nodo.id); //si el tab ya existe simplemente lo muestras tab.show(); } } }); * yo utilizo el mismo nombre que le doy a los iconos dentro de mi hoja de estilo como nombre de mis archivos asi me resulta sencillo pero puedes crear tu propia propriedad en el nodo para el nombre del archivo. espero te sirva y cualquier duda pregunta no mas, recuerda que es mejor parecer ignorante por 5 minutos por preguntar que ser ignorante toda la vida por no preguntar :-D
0
La verdad nunca he usado un IFRAME. Se que es mucho pedir, ¿ pero podrias poner al menos un ejemplo muy basico, o donde podria encontrar informacion? Gracias por tu ayuda.
0
yo en lo particular uso un iframe donde cargo todo un modulo nuevo pero puedes hacerlo de otras formas también, por ejemplo tienes la definición de un formulario en un archivo llamado, por ejemplo miform.js y al hacer clic puedes hacer la llamada o instanciar tu formulario, ahora recuerda que para poder usar el miform.show() debes de agregar el archivo miform.js al head de tu html, así que si son muchos componentes es un poco chapucero hacerlo así, por eso me decanto por el iFrame y no es muy complicado.

¿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.