12 Replies Latest reply on Jun 24, 2010 10:05 AM by docwisdom

    Reusing popup AS code...passing variables?

    docwisdom

      Disclaimer. I am new to flex and it has been years since I have done AS. I am pretty much piecing things together with example code.

       

      What I am hung up on right now is I have this AS code for a popup application called "newTicket.mxml"

       

       

      private function openWindow():void { var login:newTicket=newTicket(PopUpManager.createPopUp(this, newTicket , true) as spark.components.TitleWindow); login.x=77.5; login.y=150; }

       

       

      with this MXML call

       

      s:Button id="myButton2" label="Search KB" click="openWindow(searchKB);" x="255" y="0"

       

      This is great for invoking just the "newTicket" application, but I want to be able to reuse the AS code for multiple popups instead of hard coding for each application to be opened.

       

      soooooo

       

      how can I pass an MXML application name like click="openWindow(searchKB);"

       

      thanks!

        • 1. Re: Reusing popup AS code...passing variables?
          jsd99 Level 3

          You can't pass anything except an event in the click handler.  You could create a subclass of Button that takes an extra parameter, and then reference it via the event.currentTarget... so it would look something like

           

          <comp:MyButton windowToOpen="newTicket" click="openWindow(event)" label="Search KB />

           

          then in the click handler you could reference event.currentTarget.windowToOpen to get "newTicket".

          1 person found this helpful
          • 2. Re: Reusing popup AS code...passing variables?
            docwisdom Level 1

            I really hate being an AS noob (or returning noob)

             

            I tried working with what you recommended but I just cant get the syntax right no matter what I do.

             

            when i put windowToOpen="newTicket" in the button it totally borked at it and said it was an invalid property. So instead I tried using the inherent "id" property so id="newTicket" then up in the AS code I got all out of whack. It seems like this EXACT combination of code is the only thing that will get a stupid popup window to work. But of course this only opens the newTicket.mxml document and doesnt allow me the flexibility of opening other mxml documents with the same AS code

             

            -----------------

            private function openWindow():void {

             

            var login:newTicket=newTicket(PopUpManager.createPopUp(this, newTicket , true) as spark.components.TitleWindow);

             

            login.x=77.5;

            login.y=150;

            }

             

            <s:Button label="New Ticket" id="myButton13"  click="openWindow();" x="70" y="0"/>

            -----------------

             

             

            no matter what I try to do I get a compiler error

             

            In my logical brain, this should work, but it just doesnt.

             

            -----------------

            private function openWindow(event:Event):void {

            var whatWindow = event.currentTarget.id

             

             

            var login:whatWindow=whatWindow(PopUpManager.createPopUp(this, whatWindow , true) as spark.components.TitleWindow);

             

            login.x=77.5;

            login.y=150;

            }

             

            <s:Button label="New Ticket" id="newTicket"  click="openWindow();" x="70" y="0"/>

            -------------------

             

             

            • 3. Re: Reusing popup AS code...passing variables?
              jsd99 Level 3

              Hey Doc... you'll need to create a *subclass* of Button that takes the windowToOpen property.

              • 4. Re: Reusing popup AS code...passing variables?
                docwisdom Level 1

                Im sorry, I need a little hand-holding here...and maybe a hug...

                 

                I watched some lynda videos on actionscript in flex and managed to unsuccessfully create this class within a new .as file.

                 

                 

                package

                {

                import spark.components.Button;

                 

                 

                public class popButton extends Button

                {

                public function popButton(windowToOpen:String):void

                {

                var login:windowToOpen=windowToOpen(PopUpManager.createPopUp(this, windowToOpen , true) as spark.components.TitleWindow);

                login.x=77.5;

                login.y=150;

                super();

                }

                }

                }

                 

                 

                with an mxml button of

                <s:Button label="Search KB" id="searchKB" click="popButton(newTicket);" x="255" y="0"/>

                 

                 

                needless to say the compiler hates it.

                • 5. Re: Reusing popup AS code...passing variables?
                  jsd99 Level 3

                  docwisdom wrote:

                   

                  Im sorry, I need a little hand-holding here...and maybe a hug...

                   

                  I watched some lynda videos on actionscript in flex and managed to unsuccessfully create this class within a new .as file.

                   

                   

                  package

                  {

                  import spark.components.Button;

                   

                   

                  public class popButton extends Button

                  {

                  public function popButton(windowToOpen:String):void

                  {

                  var login:windowToOpen=windowToOpen(PopUpManager.createPopUp(this, windowToOpen , true) as spark.components.TitleWindow);

                  login.x=77.5;

                  login.y=150;

                  super();

                  }

                  }

                  }

                   

                   

                  with an mxml button of

                  <s:Button label="Search KB" id="searchKB" click="popButton(newTicket);" x="255" y="0"/>

                   

                   

                  needless to say the compiler hates it.

                   

                  sorry for the delay, i was on vacation. anyway...

                   

                  Two problems.  One, the compiler is not loading your button.  you said "s:Button" which tells it to load the usual Spark button.  you should define your own package to contain your custom controls (you don't necessarily have to but it makes things easier).  I would put popButton.as in package "com.docwisdom" (or whatever you want), then you could do:

                   

                  <mx:Canvas xmlns:docwisdom="com.docwisdom.*">

                    <docwisdom:popButton label="search KB" />

                  </mx:Canvas>

                   

                  The second problem is you are putting a click handler on the button, but the function that you want it to call is located in the popButton class.  You can only call methods in your current class.  You are better off adding the click handler to the popButton.as class directly.  This way you won't have to specify the click on every single popButton.  Remember, the idea of popButton is to encapsulate everything relating to this new type of button in one place. If you want the click to behave differently, you can define a public property in popButton.as that you specify in the MXML tag.  Say you had a "clickBehavior" property... you could then do

                   

                  <docwisdom:popButton label="search" clickBehavior="1" />

                  <docwisdom:popButton label="do something else" clickBehavior="2" />

                   

                  then in popButton's click handler code you could check the value of the property and do something appropriate based on the behavior id.  (doesn't have to be numbers, can be strings or whatever you want.)

                   

                  hope this explains things better

                  • 6. Re: Reusing popup AS code...passing variables?
                    dmfsantacruz

                    Thanks for the help so far. Im still barely treading water. I have taken some of the steps that you recommended, but I am unsure how to move the click handler from the mxml to the .as file. I just dont know the syntax. The thing that is bugging me the most is the actual popupmanager line. I just dont understand all of the parameters and this is the line that the compiler is screaming about most.

                     

                    var login:windowToOpen=windowToOpen(PopUpManager.createPopUp(this, windowToOpen, true) as spark.components.TitleWindow);

                     

                    I understand it is creating a variable called login with a type of windowToOpen (not sure how this is a type, but the example in tourdeflex is totally arbitrary too)

                    That variable equals windowToOpen (not sure what this represents)

                    PopUpManager.createPopUp (this makes sense)

                    this (this is the parent)

                    windowToOpen (this would actually represent my mxml application name)

                    true (enabled)

                    and open it as a spark component.

                     

                    So as you can see I understand some of it, but not all.

                     

                    Anyway, here is what i have so far

                    _______________

                    popButton.as

                    _______________

                    package com.prism

                    {

                    import spark.components.Button;

                     

                    public class popButton extends Button

                    {

                    var _whatWindow:String

                    public function popButton():void

                    {

                    var login:windowToOpen=windowToOpen(PopUpManager.createPopUp(this, windowToOpen, true) as spark.components.TitleWindow);

                    login.x=77.5;

                    login.y=50;

                    super();

                    }

                    }

                    }

                    ______________

                    PRISM.mxml

                    ______________

                    <?xml version="1.0" encoding="utf-8"?>

                    <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

                       xmlns:s="library://ns.adobe.com/flex/spark"

                       xmlns:mx="library://ns.adobe.com/flex/mx"

                       xmlns:prism="com.prism.*" minWidth="955" minHeight="600">

                    <fx:Declarations>

                    <!-- Place non-visual elements (e.g., services, value objects) here -->

                    </fx:Declarations>

                    <prism:popButton label="Search KB" whatWindow="searchKb"/>

                    </s:Application>

                    the  compiler is giving me the following errors
                    Description Resource Path Location Type
                    1046: Type was not found or was not a compile-time constant: windowToOpen. popButton.as /PRISM/src/com/prism line 10 Flex Problem
                    Description Resource Path Location Type
                    1120: Access of undefined property PopUpManager. popButton.as /PRISM/src/com/prism line 10 Flex Problem
                    Description Resource Path Location Type
                    1120: Access of undefined property windowToOpen. popButton.as /PRISM/src/com/prism line 10 Flex Problem
                    Description Resource Path Location Type
                    1180: Call to a possibly undefined method windowToOpen. popButton.as /PRISM/src/com/prism line 10 Flex Problem
                    I know its a lot to read, and thanks for all the help!

                    • 7. Re: Reusing popup AS code...passing variables?
                      daslicht Level 2

                      Something like this: 

                      http://wensauer.info/flex/FlexPopups/FlexPopups.html

                      (view source enabled)

                      Hope that helps somehow

                       

                      Cheers

                      Marc

                      • 8. Re: Reusing popup AS code...passing variables?
                        rootsounds Level 4

                        Yep. It's just as simple as daslicht's example:

                        1. You create a class for your pop-up window by extending TitleWindow. Add whatever properties and contents you need to this.
                        2. To display it, you create a new instance of your pop-up window class and set the properties.
                        3. Add it to the PopUpManager and display with centerPopUp().
                        • 9. Re: Reusing popup AS code...passing variables?
                          docwisdom Level 1

                          Hi Marc,

                           

                          thanks. I looked at your code and it seems that it just passes the text input to the title window text. What I need to do is specify an application name in my button and have it open that mxml application as a popup.

                           

                          so <s:Button myParameter="someApplication"> would open someApplication.mxml as a TitleWindow.

                          this way i can have

                          <s:Button myParameter="someApplication2">

                          <s:Button myParameter="someApplication3">

                          <s:Button myParameter="someApplication4">

                           

                          and all of these applications are already fully built.

                           

                          again I am fairly noob so creating classes and subclasses and extending and passing variables and all this good AS stuff is still a bit of greek to me.

                           

                           

                          Thanks for all the feedback so far!

                           

                          PS.

                          Sorry for the confusion on my screen names, I was accidently logged into my company adobe account when I posted the response last night.

                          • 10. Re: Reusing popup AS code...passing variables?
                            jsd99 Level 3

                            when you say you want to open someApplication.mxml and it's "already built" do you mean it's a separate swf file?  If so you need to use the SWFLoader class to load that swf into your application.

                             

                            see

                            http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/controls/SWFLoader.h tml

                            • 11. Re: Reusing popup AS code...passing variables?
                              daslicht Level 2

                              Hi,

                              what do you mean by Application ?

                               

                              The 'Application' with that you like to open the other Applications is the main Application , right ? and the Tile Windows are just  'sub Applications'

                               

                              Why not treat them as Tile-Windows Like I did ?  You can do anything in that TileWindow.

                               

                              Just try

                               

                              Cheers Marc

                              • 12. Re: Reusing popup AS code...passing variables?
                                docwisdom Level 1

                                Basically I am trying to build a fairly large application, albeit not horribly complex. It is basically a data entry/lookup/edit application interfacing with coldfusion & mysql.

                                 

                                Since there are so many forms and layouts I wanted to organize them into separate applications. This way I can keep my main application fairly clean and just have it launch the other applications as a title window. I got the base code from Tour De Flex under TitleWindow. It works perfectly for the one application, but I wanted to recycle that code to open any application just by passing the application name from a button property.

                                 

                                Here is a snapshot of my src.

                                 

                                Screen shot 2010-06-24 at 9.55.32 AM.png

                                 

                                prismTechLayout.mxml is the main application and popButton.as is the actionscript file I was working on for a while. All of the edit*.mxml applications are popups as well as the new*.mxml searchKb.mxml, etc etc.