1

Creating a menu with jQueryUI, I noticed that if you select a menuitem, it fires the appropriate event properly. However, if you then select another menuitem right away (without clicking on anything outside the menu first), it does not fire the menuselect event and simply treats the a tag as a regular link (this pattern repeats: 1 okay, 1 ignored, 1 okay, 1 ignored, etc...)

Here is a jsfiddle that demonstrates the issue: http://jsfiddle.net/J9eyv/4/

(1) Broken: Click an option, then click another one.

(2) Works: Click an option, click outside the menu, then click another option.

The code is modeled after the jQueryUI demo here: http://api.jqueryui.com/menu/#event-select

Am I missing something?

EDIT:

If you call $(selector).menu("focus") or, indeed, $(selector).menu("idontunderstand"), from the event callback, this 'fixes' the issue. That doesn't sound right.

EleventyOne
  • 7,300
  • 10
  • 35
  • 40

2 Answers2

1

This was a bug in jQueryUI. It's being addressed.

EleventyOne
  • 7,300
  • 10
  • 35
  • 40
  • 1
    Now that this bug is long fixed, I found another way to create a problem with very similar symptoms that led me here. If you prevent a click on the jQuery UI selectmenu (or menu, in my case) from bubbling up the DOM with `event.stopPropagation();`, the same thing will happen. – kevinmicke Feb 07 '19 at 18:38
0

I'm not sure about "menuselect" you're using but it works fine if you do this:

 $("#menu").menu();

 $("#menu a").click(function() {
     alert($(this).attr("href"));
     return false;
 });
johnr
  • 347
  • 1
  • 6
  • True enough. However, I'd like to be able to utilize the "menuselect" event, so I don't need to add an event handler for every `a` tag. – EleventyOne Jul 31 '13 at 22:50
  • You can still do this through use of live. `$('#menu a').live('click', function() {` and this should work for every anchor tag added to the menu after the javascript is executed. – johnr Jul 31 '13 at 22:53
  • Although `.live` is deprecated (1.7+: http://api.jquery.com/live/), indeed, `.on` would work if I parsed the incoming `a` tag. Nevertheless, I'm trying to figure out how the jQueryUI "menuselect" event works (or doesn't work). – EleventyOne Jul 31 '13 at 22:56
  • .on could be used `$('#menu').on('click', 'a', function() {` but let me see if I can find something about menuselect... – johnr Jul 31 '13 at 22:59
  • I think it might just be a part of how the menuselect event works, until focus leaves the "menu" another item cannot be selected once one is selected. You can fake this though by adding `$('body').click();` to the first line inside your delegate function before your alert. As shown: http://jsfiddle.net/J9eyv/12/ – johnr Jul 31 '13 at 23:03