<af:showPopupBehavior>

The showPopupBehavior tag is a declarative way show a popup component in response to a client-side event - usually an AdfActionEvent, though this can be set otherwise. When the showPopupBehavior tag is associated with a component, the popup specified via the "popupId" attribute will automatically be shown when the AdfActionEvent is activated. This tag will be ignored for any server-rendered components, as it is only supported for the rich client.

The showPopupBehavior tag cancels server-side event delivery automatically - so actionListener or action attributes on the parent component will be ignored. This cannot be disabled. Developers that need to also trigger server-side functionality can either use manual Javascript to show a popup, or add an additional client listener that uses AdfCustomEvent and af:serverListener to deliver a server-side event.

To show a popup in response to another event, set the "triggerType" property. This is most useful with the "contextMenu" value, as this will automatically use the appropriate platform gesture for showing a popup menu (usually right-click, but control-click on MacOS, for example) to show a popup menu.

Examples:

This example will show the popup with the id "somePopup" when the button is clicked.

<source>
            <af:commandButton text="Click me">
                <af:showPopupBehavior popupid="somePopup"/>
            </af:commandButton>

</source>

This example will shows a menu popup with the id "someMenuPopup" when anything within the panelGroupLayout is right-clicked.

<source>
            <af:panelGroupLayout>
                <af:showPopupBehavior popupid="someMenuPopup"
                                      triggerType="contextMenu"/>
                .... any other content ...
            </af:panelGroupLayout>

</source>

The following table lists component family-specific event types that can be assigned to the triggerType attribute:

Event Type	Component Family	Description
action	Command	Fires when user triggers the command component
dialog	Dialog	Fires when user clicks dialog OK/Cancel buttons
disclosure	ShowDetail	Fires when disclosure state is toggled
load	Document	Fires when the document finishes loading
fetch	Popup	Content fetch event fired before opening if the content delivery of the popup is lazy or lazyUncached. This is the first of two events required for content delivery.
contentLoaded	Popup	Partial content delivery has been delivered to the browser. This event notifies the popup component that it can be shown. Second content delivery event.
popupOpening	Popup	Fired prior to opening a popup
popupOpened	Popup	Fired after popup is opened
popupClosed	Popup	Fired after popup is closed
query	Query	Fired when a query action happens(when user clicks the search icon in quickQuery or the search button in the query component)
rowDisclosure	Tree, TreeTable	Fired row disclosure state is toggled
selection	Table, Tree, TreeTable	Fires when selection state changes
sort	Table	Fires when user sorts data
valueChange	Input, Select\*	Fires when the value of an input control is changed

The following table lists input (mouse/keyboard) event types. These events are delivered for all components (though in some cases may be consumed by the peer implementation) and can be assigned to the triggerType attribute:

Event Type	Description
click	Fires when user clicks on component
contextMenu	Shows the popup on right mouse click
dblClick	Fires when user double clicks on component
mouseDown	Fires when user performs mouse down on component
mouseUp	Fires when user performs mouse up on component
mouseMove	Fires when user moves mouse while over a component
mouseOver	Fires when mouse enters a component
mouseOut	Fires when mouse leaves a component
keyDown	Fires when user presses key down while focused on a component
keyUp	Fires when user releases key while focused focused on a component
keyPress	Fires when successful key press occurs while focused on a component
focus	Fires when component gains keyboard focus
blur	Fires when component loses keyboard focus

The following table lists hybrid event types that combine multiple event types:

mnemonic	Description
mouseHover	Hybrid event type that shows the popup on mouseOver and hides the popup on mouseOut

Attributes

Name	Type	Supports EL?	Description
popupId	String	yes	the ID of the popup, relative to the containing component. An ID beginning with a colon will be treated as absolute (after trimming off the colon).
alignId	String	no	the ID of the component relative to which the popup will be aligned. An ID beginning with a colon will be treated as absolute (after trimming off the colon). All other ids will be resolved relative to the component which contains the showPopupBehavior.
align	String	no	indicates how the popup should aligned relative to the alignId component. Valid values include: afterStart: The popup appears underneath the element with the popup's upper-left corner aligned with the lower-left corner of the element. The left edges of the element and the popup are aligned. afterEnd: The popup appears underneath the element with the popup's upper-right corner aligned with the lower-right corner of the element. The right edges of the element and the popup are aligned. beforeStart: The popup appears above the element with the popup's lower-left corner aligned with the upper-left corner of the element. The left edges of the element and the popup are aligned. beforeEnd: The popup appears above the element with the popup's lower-right corner aligned with the upper-right corner of the element. The right edges of the element and the popup are aligned. endAfter: The popup appears to the right of the element with the popup's lower-left corner aligned with the lower-right corner of the element. The bottom edges of the element and the popup are aligned. endBefore: The popup appears to the right of the element with the popup's upper-left corner aligned with the upper-right corner of the element. The top edges of the element and the popup are aligned. startAfter: The popup appears to the left of the element with the popup's lower-right corner aligned with the lower-left corner of the element. The bottom edges of the element and the popup are aligned. startBefore: The popup appears to the left of the element with the popup's upper-right corner aligned with the upper-left corner of the element. The top edges of the element and the popup are aligned.
triggerType	String	no	the event type which will trigger the popup being shown. By default, this is "action". To show a popup menu, use "contextMenu". To show a non-modal popup upon the mouse appearing over the trigger component and also to hide it upon the mouse leaving the trigger component, use "mouseHover".