title: PopUpAnchor - conflict between "click" and "mouseDownOutside" event handlers
body: <p>I have a PopUpAnchor to display some content. I added a <code>mouseDownOutside</code> event handler so if the user clicks outside the popup content, the popup content will be hidden. That works fine.</p>
  
  <p>I would also like the button which controls showing the popup to function as a toggle, so that if the popup content is being displayed and the button clicked, the content will be hidden.</p>
  
  <p>What is happening in the code below is that with the popup content showing, if the button is clicked, the <code>mouseDownOutside</code> event handler gets called and then the <code>click</code> handler so that the popup content is hidden and then shown again.</p>
  
  <p>Is there a way I can resolve this without complexity (e.g. adding and removing eventListeners on the fly)?</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;s:WindowedApplication 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="1024" height="768"&gt;
      &lt;fx:Script&gt;
          &lt;![CDATA[
              import mx.events.FlexEvent;
              import mx.events.FlexMouseEvent;
  
  
              protected function managePopup(event:MouseEvent):void
              {
                  if (popupContent.isPopUp == false){
                      trace("managePopup -- opening");
                      popUp.displayPopUp = true;
  
                  } else {
                      trace("managePopup -- closing");
                      popUp.displayPopUp = false;
                  }
              }
          ]]&gt;
          &lt;/fx:Script&gt;
  
          &lt;s:Group x="10" y="10"&gt;
              &lt;!-- Button used to open PopUp --&gt;
              &lt;s:Button id="openBtn" label="Open PopUp" 
                        click="managePopup(event)"/&gt;
  
              &lt;!-- PopUpAnchor component set to same size as openBtn to ensure that
              popUp will be positioned relative to the button --&gt;
              &lt;s:PopUpAnchor id="popUp" 
                             popUpPosition="right" 
                             width="92" height="21"&gt;
                  &lt;!-- BorderContainer to hold popUp contents --&gt;
                  &lt;s:BorderContainer id="popupContent" 
                                     mouseDownOutside="managePopup(event)"&gt;            
                      &lt;s:layout&gt;
                          &lt;s:VerticalLayout paddingTop="5" 
                                            paddingLeft="5" 
                                            paddingBottom="5" 
                                            paddingRight="5"/&gt;
                      &lt;/s:layout&gt;
                      &lt;s:Form&gt;                                            
                          &lt;s:FormItem label="Name :"&gt;
                              &lt;s:TextInput/&gt;
                          &lt;/s:FormItem&gt;                                            
                          &lt;s:FormItem label="E-Mail :"&gt;
                              &lt;s:TextInput/&gt;
                          &lt;/s:FormItem&gt;
                      &lt;/s:Form&gt;                            
                      &lt;s:HGroup&gt;                                                                
                          &lt;!-- Button used to close popUp --&gt;
                          &lt;s:Button label="CLOSE" click="managePopup(event)"/&gt;
                      &lt;/s:HGroup&gt;                
                  &lt;/s:BorderContainer&gt;                        
              &lt;/s:PopUpAnchor&gt;    
          &lt;/s:Group&gt;
  
  &lt;/s:WindowedApplication&gt;
  </code></pre>