Get the selected item

Question

Sorry if my question is too simple, but I can't figure it out from the jQuery UI documentation.

How can I determine which option was clicked within a menu? I tried something like this but it didn't work:

var menu = $('#menu');
menu.menu({
    select: function(event, ui) {
        alert(ui.type);
    }
});

You're looking for the text value of the menu item you click on? — j08691, Dec 18 '12 at 16:35
I think so. I need an action to the click, and it changes depending on the option selected. — Uder Moreira, Dec 18 '12 at 16:50

score 19 · Accepted Answer · answered Dec 18 '12 at 17:00

19

What you are missing is the fact that 'ui' is a jQuery object that represents the item you clicked.

so to get the text out of that item you should be using:

    var menu = $('#menu');

    $(document).ready(function(){
        menu.menu({
            select: function(event, ui) {
                alert(ui.item.text());
            }
        });
    });

That will give you the text of the item.

here is a Fiddle

answered Dec 18 '12 at 17:00

Pow-Ian

3,607
1
22
31

I am glad. Your welcome. The API Documentation can be a bit confusing. – Pow-Ian Dec 18 '12 at 18:03
With nested menus this gives too much text as result :/ – Jure Špik May 05 '15 at 15:43
Had to use ui.item[0].childNodes[1].data to get just current node text – Jure Špik May 05 '15 at 15:50
1

Not sure how nested they have to be before this stops working. [Here is an example with nested menus](http://jsfiddle.net/02txmbm4/15/) – Pow-Ian Sep 21 '15 at 19:47

Get the selected item

1 Answers1