Comunidad de diseño web y desarrollo en internet online

Parámetros a un pop-up en Flex

Citar            
MensajeEscrito el 08 Abr 2008 12:15 pm
Hola a tod@s !
Soy un novato de Flex con muchas preguntas, pero como hay que empezar por algo ahí vamos...

Tengo una aplicación bastante simple en flex y quiero que, al llamar a un componente en modo pop-up, le pueda pasar parámetros (para ver por ejemplo desde donde lo he llamado y esas cosas). He estado mirando por el foro y he visto algun comentario pero no referente a flex, sino a flash, y como estoy programando sobre ActionScript ...

Un saludo y gracias de antemano !!

Por Josel3

2 de clabLevel



Genero:Masculino  

Belgium

firefox
Citar            
MensajeEscrito el 08 Abr 2008 04:06 pm
puedes acceder directamente a las variables de tu componente mediante el codigo, declarandolas publicas obviamente

Código :

var ventana:TuVentana = TuVentana(PopUpManager.createPopUp(this, TuVentana, true));
ventana.var1 = "nombre";
ventana.var2 = 1024;

Por master_of_puppetz

Claber

2483 de clabLevel

7 tutoriales
3 articulos

Genero:Masculino   Premio_Secretos

WebDev (Flex + PHP + JS)

firefox
Citar            
MensajeEscrito el 09 Abr 2008 07:33 am
Muchas gracias ! Funciona perfecto :D

^^

Por Josel3

2 de clabLevel



Genero:Masculino  

Belgium

firefox
Citar            
MensajeEscrito el 09 Abr 2008 02:43 pm
Otra duda que me ha surgido... ¿Hay algún modo de referenciar la ventana que ha llamado a un popup desde ese popup?

Lo que quiero hacer es, en un Calendario (dateChooser) cuando le doy a doble click en una fecha me sale una ventanita pop up para reservar el día. Cuando cierro el pop up quiero que la fecha seleccionada cambie de color, alguna idea ??

Gracias !!

Por Josel3

2 de clabLevel



Genero:Masculino  

Belgium

firefox
Citar            
MensajeEscrito el 10 Abr 2008 08:07 am

Por Josel3

2 de clabLevel



Genero:Masculino  

Belgium

firefox
Citar            
MensajeEscrito el 30 Sep 2010 09:01 pm
bueno lo que yo te recomiendo es hacer que tu popup se abra como te dijeron arriba.hasta hay no hay problemas.
luego para transmitirlo al creador o a donde quieras.usa un evento personalizado donde pases los/el parametro.y agregas un listener donde quieras que lo oigan y listo.
si tienen alguna duda aca dejo un ejemplo donde el padre es un componente stock donde en el articulo lo abro con un boton y me muestra el popup cuando hago click en el articulo.se cierra y lo muestra en el componente stock
lo que uso son 2 eventos personalizados,por que el pop up es usado en otros componentes: 1 evento refresh para que actualizen y un evento con parametro para que se pasen los parametros,1 componente padre y 1 pop up

EL COMPONENTE PADRE ES EL DE STOCK Y ESTE ES EL CODIGO

Código Flex :

<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/mx" width="100%" height="100%" xmlns:clases="clases.*" xmlns:services="services.*" creationComplete="init()">
    <s:layout>
        <s:BasicLayout/>
    </s:layout>
    <fx:Script>
        <![CDATA[
            import clases.DateChooserSpanish;
            import clases.Ip;
            
            import events.PopArtEvent;
            
            import mx.collections.ArrayCollection;
            import mx.controls.Alert;
            import mx.core.IFlexDisplayObject;
            import mx.events.FlexEvent;
            import mx.managers.PopUpManager;
            import mx.rpc.events.ResultEvent;
            
            import popups.especificos.p_esp_articulo;
            
            private var articulo:Object;
            private var _idarticulo:int;
            private var _articulo:String;
            private var _descripcion:String;
            private var _precio:Number;
            private var _cantidad:int;
            private var _idart:int;
            private var _codarticulo:int;
            [Bindable]
            private var dpStock:ArrayCollection;
            
            private function init():void{
                dpStock    = new ArrayCollection();
                txtCantidad.text = "1";
                txtArticulo.addEventListener(FlexEvent.ENTER,getArticulo);
                dateChooser.showToday = true;
            }
            private function fArticulo():void{
                var abriendo:IFlexDisplayObject = PopUpManager.createPopUp(this, p_esp_articulo, true);                
                PopUpManager.centerPopUp(abriendo); 
                abriendo.addEventListener("popArEvent",saveArticulo);
                abriendo.x = 250;
                abriendo.y = 20;
            }
            
            private function getArticulo(e:Event):void{
                
                if(txtArticulo.text == ""){}else{
                    _getArticulo.token = select.getArticuloVenta(parseInt(txtArticulo.text));
                }}
            
            public function saveArticulo(e:PopArtEvent):void{
                _idarticulo =e.data.idart;
                _precio= e.data.precio;
                _articulo = e.data.articulo;
                _codarticulo = e.data.codarticulo;
                _descripcion = e.data.descripcion;
                txtArticulo.text = _codarticulo.toString();
                agregar();
            }
            
            private function getArticulo_result(e:ResultEvent):void{
                var usuario:Object = e.result as Object;
                try{
                    _idarticulo = usuario[0][0];
                    _articulo = usuario[0][1];
                    _precio = usuario[0][3];
                    _descripcion = usuario[0][2];
                    if ((_articulo.toString() =="")||(_precio==0)||(parseInt(txtCantidad.text)==0))
                    {Alert.show("Algun campo esta sin completar");}else{
                        _cantidad = parseInt(txtCantidad.text);
                        dpStock.addItem({idarticulo:_idarticulo,articulo:_articulo, precio:_precio,cantidad:_cantidad,descripcion:_descripcion});
                        txtArticulo.text = "";
                        
                    }
                }catch(e:Error){
                    Alert.show("El Articulo ingresado no existe");
                    txtArticulo.text = "";
                }
            }
            
            private function agregar():void{
                //cargo en la caja de total el monto 
                //total mientras agrego
                //autoincrementando el precio
                try{
                    if ((_articulo.toString() =="")||(_precio==0)||(parseInt(txtCantidad.text)==0)){
                        Alert.show("Algun campo esta sin completar");
                    }else{
                        _cantidad = parseInt(txtCantidad.text);
                        dpStock.addItem({articulo:_articulo, precio:_precio,cantidad:_cantidad,descripcion:_descripcion});
                    }}catch(e:Error){

                        
                    }            
            }
            
            private function borrar():void{
                try{
                    var ultimo:int;
                    var item:Object;
                    ultimo=dpStock.length;
                    dpStock.removeItemAt(ultimo-1);
                }catch(e:Error){

                }
            }
            
            private function confirmar():void{
                var len:int;
                var i:int;
                len =dpStock.length;
                if ((txtCantidad.text =="0")||(txtCantidad.text == "")||(dateChooser.text  == "")){
                    Alert.show("Falta cargar algun campo");
                }else{
                for(i=0;i<len;i++){
                    articulo=dpStock.getItemAt(i);    
                    _setStock.token = insert.setStock(dateChooser.text,articulo.idarticulo,"",parseInt(txtCantidad.text),99,0,1);
                }
                }
            }
            
            private function _setStock_result(e:ResultEvent):void{
                var res:Boolean = e.result as Boolean;
                if (res == false){
                    Alert.show("Los datos fueron guardados");                    
                    dpStock.removeAll();
                    txtCantidad.text = "";
                    txtArticulo.text = "";
                }else{
                    Alert.show("No se pudo guardar");
                }
            }
        ]]>
    </fx:Script>
    <fx:Declarations>
        <s:CallResponder id="_setStock" result="_setStock_result(event)"/>
        <s:CallResponder id="_getArticulo" result="getArticulo_result(event)"/>
        <services:Select id="select" endpoint="{Ip.ip.toString()}" fault="Alert.show(event.fault.faultString + '\n' + event.fault.faultDetail)" showBusyCursor="true"/>
        <services:Insert id="insert" endpoint="{Ip.ip.toString()}" fault="Alert.show(event.fault.faultString + '\n' + event.fault.faultDetail)" showBusyCursor="true"/>
    </fx:Declarations>
    <s:Panel width="536" height="410" horizontalCenter="0" top="25">
        <s:layout>
            <s:BasicLayout/>
        </s:layout>
        <s:Label x="57" y="47" text="Articulo:" height="22" paddingTop="5"/>
        <s:TextInput x="109" y="48" width="142" tabIndex="1" id="txtArticulo"/>
        <mx:Button x="250" y="48" width="29" height="22" icon="@Embed(source='../iconos/tables.gif')" id="cmdArticulo" toolTip="Busca un articulo" click="fArticulo()" tabIndex="2"/>
        <s:Label x="47" y="77" text="Cantidad:" height="22" paddingTop="5"/>
        <clases:DateChooserSpanish x="313" y="46" id="dateChooser" tabIndex="3" formatString="DD/MM/YYYY"/>
        <s:TextInput x="109" y="78" width="28" tabIndex="5" id="txtCantidad"/>
        <s:Button x="416" y="47" label="Confirmar" height="22" width="85" tabIndex="6" id="cmdConfirmar" click="confirmar()"/>
        <mx:AdvancedDataGrid x="57" y="133" id="dataGrid" designViewDataType="tree" width="444" dataProvider="{dpStock}">
            <mx:columns>
                <mx:AdvancedDataGridColumn headerText="idArticulo" dataField="idarticulo" visible="false"/>
                <mx:AdvancedDataGridColumn headerText="Articulo" dataField="articulo"/>
                <mx:AdvancedDataGridColumn headerText="Precio" dataField="precio"/>
                <mx:AdvancedDataGridColumn headerText="Descripcion" dataField="descripcion"/>
                <mx:AdvancedDataGridColumn headerText="Cantidad" dataField="cantidad"/>
            </mx:columns>
        </mx:AdvancedDataGrid>
        <s:Label x="219" y="105" text="Articulos cargados" fontWeight="bold" textDecoration="underline"/>
        <s:Button x="418" y="78" label="Borrar" click="borrar()" width="83" height="22"/>
        <s:Label y="-23" text="Ingreso de stock sin proveedor" horizontalCenter="-1" fontWeight="bold"/>
    </s:Panel>
    
</s:Group> 



EL POPUP ES ESTE Y SE LLAMA P_ESP_ARTICULO y esta en la carpeta popups.especificos

Código Flex :

<?xml version="1.0" encoding="utf-8"?>
<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" width="508" height="60%" close="PopUpManager.removePopUp(this);" creationComplete="init()" xmlns:services="services.*" >
    <s:layout>
        <s:BasicLayout/>
    </s:layout>
    <fx:Metadata>
        [Event(name="popArEvent", type="events.PopArtEvent")]
        [Event(name="refreshEvent", type="events.RefreshEvent")]
    </fx:Metadata>
    <fx:Declarations>  
        <fx:Model id="articulos">
            <custInfo>
                <idart>{dataGrid.selectedItem[0]}</idart>
                <articulo>{dataGrid.selectedItem[1]}</articulo>
                <precio>{dataGrid.selectedItem[3]}</precio>
                <codarticulo>{dataGrid.selectedItem[4]}</codarticulo>
                <descripcion>{dataGrid.selectedItem[2]}</descripcion>
            </custInfo>
        </fx:Model>
        <services:Select id="getArticulos" endpoint="{Ip.ip.toString()}"  fault="Alert.show(event.fault.faultString + '\n' + event.fault.faultDetail)" showBusyCursor="true" result="getArticulos_result(event)"/>    
    </fx:Declarations>
    <s:VGroup width="100%" height="100%" x="4" y="0">
        <s:HGroup x="10" y="10" width="100%" height="39" verticalAlign="middle" gap="20" paddingLeft="15">
            <s:Label text="Buscar:"/>
            <s:TextInput id="txtBusqueda" width="151" keyDown="find()"/>
            <!--<s:Button label="Buscar" click="buscar()"/>-->
        </s:HGroup>
        <s:HGroup width="100%" height="100%">
            <mx:AdvancedDataGrid width="492" height="234"  id="dataGrid" editable="false"   color="#5A5C59" horizontalCenter="-18" click="guardar()">
                <mx:columns>                
                    <mx:AdvancedDataGridColumn headerText="Articulo" dataField="1" styleFunction="NotReadFunction"  />
                    <mx:AdvancedDataGridColumn  headerText="Descripcion" dataField="2" styleFunction="NotReadFunction"/>        
                    <mx:AdvancedDataGridColumn headerText="idarticulo" dataField="4" width="75"  styleFunction="NotReadFunction" />
                    <mx:AdvancedDataGridColumn headerText="id" dataField="0" visible="false" styleFunction="NotReadFunction" />
                    <mx:AdvancedDataGridColumn width="75"  headerText="Precio"  dataField="3" styleFunction="NotReadFunction" visible="false" />
                </mx:columns>
            </mx:AdvancedDataGrid>
        </s:HGroup>
    </s:VGroup>
    
    <fx:Script>
        <![CDATA[
            import ABM.articulos;            
            import clases.Ip;            
            import events.PopArtEvent;
            import events.RefreshEvent;            
            import flashx.textLayout.formats.Float;
        
            import mx.containers.TitleWindow;
            import mx.controls.Alert;
            import mx.core.IFlexDisplayObject;
            import mx.events.FlexEvent;
            import mx.managers.PopUpManager;
            import mx.rpc.events.ResultEvent;
            
        private function init():void{
            getArticulos.getArtSinBaja();                            
        }
        
        private function getArticulos_result(e:ResultEvent):void{
            var cad:Object = e.result as Object;
            dataGrid.dataProvider = cad;    
            
        }
        
        private function find():void{
            dataGrid.findString(txtBusqueda.text);
        }
        
        
        
        private function NotReadFunction(data:Object,col:AdvancedDataGridColumn):Object{
            
            if (data["4"]== 1){
                return {color:0xee3c3c,fontWeight:"bold"}          
            }else{
                return null
            }}
        private function refresh():void{
            getArticulos.getArtSinBaja();
        }    
            
            private function guardar():void{
            /*
                Y TRANSMITO UN EVENTO PARA NOTIFICAR EL GUARDARO Y  PASO LOS PARAMETROS*/
                var even:PopArtEvent = new PopArtEvent("popArEvent",articulos);                    
                dispatchEvent(even);
                var ev:RefreshEvent = new RefreshEvent("refreshEvent");                    
                dispatchEvent(ev);
                PopUpManager.removePopUp(this);
            }
        ]]>
    </fx:Script>
</s:TitleWindow>


y los 2 eventos personalizados el primero es el evento que se llama RefreshEvent.as y el segundo PopArtEvent aca esta el codigo

Código Flex :

package events
{
    import flash.events.Event;
    
    public class RefreshEvent extends Event
    {
        public function RefreshEvent(type:String)
        {
            super(type,true);
        }
        public override function clone():Event
        {
            return new RefreshEvent(type);            
        }
    }
}


y el con parametro

Código Flex :

package events
{
    import flash.events.Event;
    
    public class PopArtEvent extends Event
    {
        public var data:Object;
        public function PopArtEvent(type:String,data:Object)
        {
            super(type,true);
            this.data = data;
        }
        
        public override function clone():Event
        {
            
            return new PopArtEvent(type,data);            
        }
    }
}


netamente uso el evento refresh en los que tengo que actualizar algun cambio o activacion en el evento(en el caso de cerrar sin la X)
y el otro evento para pasar el parametro.el funcionamiento es casi el mismo para ambos. cualquier cosa me mandan un mp y les contesto. aprovechen que esto no esta en todos lados y funcionando :D

Por viru2k

20 de clabLevel



 

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.