2 Replies Latest reply on Sep 3, 2009 11:44 AM by Powder77

    Component button Click Event




      I have a custom component that is a login form. This login form will have muilitple uses so I don't want to set the click event on the login button in the custom component but I want to set the click event of the button in the component from the parent eg from the <application> I want to do this in MXML as i want don't want any AS in the default <application> file


      Here is my code the custom component is <ns1:LoginPanel id="loginpanel1" /> right at the bottom of the code below


      Default Application file
      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application  xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:ns1="*" borderStyle="inset" borderColor="#B7BABC" cornerRadius="15" horizontalAlign="center" verticalAlign="top" xmlns:grc="grc.*" xmlns:events="flash.events.*">
        <mx:State name="MainApp">
         <mx:RemoveChild target="{loginpanel1}"/>
         <mx:AddChild position="lastChild">
          <mx:Label text="User Has Now Logged Inn" fontSize="30"/>
         <mx:AddChild position="lastChild">
          <mx:Label id="username"/>
         <mx:AddChild position="lastChild">
          <mx:Button label="Button" />
         <mx:RemoveChild target="{image1}"/>
       <mx:Style source="yflexskin.css" />
       <mx:Image source="@Embed('images/engage_logo.png')" id="image1"/>
       <grc:Initialize id="remoteService"/>
       <ns1:LoginPanel id="loginpanel1" />  <<-- Here is the Custom Component I have a button called "loginButton" in the component how do I set the click event for the button from here using MXML


      Thanks in advance for any help it is driving me crazy as an new to Flex, but come from a PHP back gorund. Must say am very impressed with flex for RIA




        • 1. Re: Component button Click Event
          Andrew Rosewarn Level 3

          Hi there


          Handle your click event in the custom component but only to dispatch an event to show the button it clicked.


          <?xml version="1.0" encoding="utf-8"?>
          <mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="300">
                      private function clickHandler():void {
                          dispatchEvent(new Event('myClickEvent')):
                  [Event(name="myClickEvent" type="flash.events.Event")]
              <mx:Button x="10" y="20" label="Button" click="clickHandler()"/>


          By using the <MetaData> tag you expose your custom event to mxml when you use your customComp tag in your main App.  So in your main app you can handle it there


          <?xml version="1.0" encoding="utf-8"?>
          <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:ns1="*">
              <ns1:CustComp x="23" y="28" myClickEvent="myClickHandler()">


          That way you can write many event handlers for the different ways to want when you instansiate your custom comp.


          Hope that helps



          • 2. Re: Component button Click Event
            Powder77 Level 1

            Thanks Andrew just what I was looking for your a star