Detecting onclick of the body content


#1

Knowledgable pals,

I’m displaying a custom list of drop-down values (when a textfield is focussed) using a dynamic panel and I’ve to hide that panel onclick of something other than the panel itself which in most cases the body of the page itself. I’m aware that treating a dynamic panel as a flyout or a Lightbox helps achieve this. However, doing this does not trigger any events. In my case I have to perform some functions when he panel is hidden. Now, if I force focus on other elements I can use the lost focus event on the textfield associated with the list and hide the list. But most of the time someone clicks on the body content and the list needs to hidden.

In JavaScript when someone clicks on the body we can easily achieve the above result by returning false. Is there anyway to achieve this equivalent in Axure?

Thanks!
-Mani B


#2

Using the “treat as flyout” or “treat as flyout” option when showing your dynamic panel (dp) actually does trigger an event: the Hidden event of that dp widget. So, you can use that to perform your functions. However, with the “flyout” option, the dp will automatically hide when the cursor exits its area, and using the “lightbox” option isn’t a typical visual effect of a droplist–but the dp will be shown until something is clicked.

See this quick demo, where Page 1 shows a solution using “treat as flyout” …where I did some funky things to show that automatically hiding the droplist dp performs “other functions”. On Page 2 I show a solution with a “normally” shown list dp, utilizing the text field’s Lost Focus event to hide the dp and other actions.

custom droplist with clicks.rp (99.5 KB)


closed #3

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.