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);
    }
});​

Lasley

You're looking for the text value of the menu item you click on? – Naraka

I think so. I need an action to the click, and it changes depending on the option selected. – Lasley

@ExplosionPills jqueryui.com/menu – Hecatomb

.menu is here: jqueryui.com/menu – Lasley

Answer 1

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

Triceratops

I am glad. Your welcome. The API Documentation can be a bit confusing. – Triceratops

With nested menus this gives too much text as result :/ – Ovular

Had to use ui.item[0].childNodes[1].data to get just current node text – Ovular

Not sure how nested they have to be before this stops working. Here is an example with nested menus – Triceratops