ExecuteJavascript to "open" a WebPopupMenu?

Hey,
I was thinking. Is there a way to “open” a WebPopupmenu in the Action event of a WebButton?
Basically simulate the mouse click on the menu itself.
Something like this?

PopupMenu1.ExecuteJavaScript("document.getElementById('" + PopupMenu1.ControlID + "').click();")

Nothing happens thought.

Any ideas? :slight_smile:

[quote=119969:@Albin Kiland]Hey,
I was thinking. Is there a way to “open” a WebPopupmenu in the Action event of a WebButton?
Something like this?

PopupMenu1.ExecuteJavaScript("document.getElementById('" + PopupMenu1.ControlID + "').click();")

Nothing happens thought.[/quote]

Quoting Greg O’Lone from another thread :

Now, if what you need is to display options in a box, why not use a Contextual menu instead, or a WebListBox used as a menu ?

I need to style it to blend in with the rest of the GUI and the Contextual meny is only half way there :wink:
Trying to think of a workaround for Styles not applying well on WebPopupMenus.

Create a button “looking” like a Popupmeny that would display a menu in some way…haven’t thought this all the way through yet :stuck_out_tongue:

Maybe I need to just use the ContextualMeny but my designer eye might sting :stuck_out_tongue:

On a second thought, the default Popupmenu might not look too bad. At least in Safari…Firefox is another story :stuck_out_tongue:
Thanks Michel for chiming in :slight_smile:

Quick experiment with a WebListBox :

Actually, the best result I got in a few minutes was to place a ListBox on a WebContainer as to mask the scrollbar, set the WebContainer with scrollbar never, and apply to it a WebStyle with small round corner (8) and a grey 1 pixel border. I am sure obtaining exactly the same effect as the popupmenu drop down menu is possible.

Since we’re not suppose to mess with the DOM of the built in stuff I usually create a custom web control that does nothing but passes events through. You could add an event that shows the WebPopupMenu for a specific control.

I’ve also built my own popupmenu’s using containers. They support scrolling and images and custom styles. But you can also overwrite the default WebPopupMenu style in the Session header’s event with some CSS.

Good question. Let me know if you find out…

I found a “work around” to fire control events (non-custom-control) directly, implementing virtual “mouse events” as such…

ExecuteJavaScript "var dropdown = document.getElementById('" + PopupMenu1.ControlID + "');"+_ "var event = document.createEvent('MouseEvents');"+_ "event.initMouseEvent('mousedown', true, true, window);"+_ "dropdown.dispatchEvent(event);"

whereas Xojo’s “built-in” event trigger doesn’t work in such a case using:

ExecuteJavaScript "Xojo.comm.triggerEvent("+ PopupMenu1.ControlID + ",'MouseDown');"

but to open the box itself, I’ll have to play around with some JS a bit and get back to you as the Click event itself will probably need to be “virtualized” as well. I wrote a “mouse-recorder” a while back in JS to complete webpages and fill items out that required “physical clicks” (no DOM play)…will dig it out and see what I did for the clicks (possibly revive it and migrate the code to Xojo?).

Even if we wanted to hack the DOM to use Click() on a PopupMenu, JavaScript does indeed trigger buttons MouseDown and Action event, but it does not show on the screen. It seems the visual confirmation of the click depends on the length of the mouse button press which JS Click() does not provide.

For PopupMenu, if it worked, MouseDown alone would probably for the same reason not be enough to have the menu drop down.

Similar requests for Desktop usually found a solution through an emulation of the drop down part, as Brock describes. It is really not difficult to do.

Here is a side by side comparison between a dropped down PopupMenu and a Contextual menu. It is fairly easy to precisely position and display a ContextualMenu through PresentContextualMenu attached to a 1x1 px canvas.

[quote=120084:@Michel Bujardet]
Here is a side by side comparison between a dropped down PopupMenu and a Contextual menu. It is fairly easy to precisely position and display a ContextualMenu through PresentContextualMenu attached to a 1x1 px canvas.

[/quote]
I think the ContextualMenu will work. The blue color is slightly off as it’s not in my gui color scheme but I’ll work :slight_smile:
Thanks Michel :slight_smile:

Thank you Matthew and Brock too :slight_smile:
I’ll settle with the ContextualMeny.

Ended up with this. As you can see the Blue is a bit off :stuck_out_tongue:

[quote=120227:@Albin Kiland]Ended up with this. As you can see the Blue is a bit off :stuck_out_tongue:

Indeed, for some reason, the blue is different as well in the WebListBox selection. I tried to figure a custom control using labels which would have allowed setting colors through WebStyles, but the selection under the mouse was unusable even with MouseEnter/MouseExit. It may be possible to do better in JavaScript, but I have never done that before.