tom91136
tom91136

Reputation: 8962

jQuery limit selector to it's parent

i'm trying to create a context menu for jQuery, i was using the jQuery UI dialog and modifying it to fit my needs:

var menu = $(this);
menu.dialog('option', 'position', [jsEvent.clientX, jsEvent.clientY]);
    menu.unbind('dialogopen');
    menu.bind('dialogopen', function(event, ui) {

        $('.ui-dialog-titlebar').hide();
        $('.ui-widget-overlay').unbind('click');
        $('.ui-widget-overlay').css('opacity', 0);
        $('.ui-widget-overlay').click(function() {
            menu.dialog('close');
        });
    });
    menu.dialog('open');

now, this only works if there is no UI that uses .ui-dialog-titlebar since they will disappear when ever context menu fires

i thought of doing this:

var id = '#'+$(this).attr('id');

and select elements only in my menu

$(id+' .ui-dialog-titlebar').hide();

but it doesn't seems to work, the .ui-dialog-titlebar is still there

how do i select elements in the menu ONLY?

Upvotes: 0

Views: 1248

Answers (3)

Jayamurugan
Jayamurugan

Reputation: 1825

You can try like this,

var menu = $(this);
$(menu).find('.ui-dialog-titlebar').hide();

You can refer jQuery Selector. If needed..

Upvotes: 1

adeneo
adeneo

Reputation: 318212

To find all elements with a certain class within another element you can use find() :

$(this).find('.ui-dialog-titlebart').hide();

If you'd like to hide all elements with a certain class except UL elements :

$('.ui-dialog-titlebar').not('ul').hide();

or target just LI elements

$('li.ui-dialog-titlebar').hide();

Upvotes: 1

Michael Peterson
Michael Peterson

Reputation: 1123

$('.ui-dialog-titlebart', this).hide()

$('the item you want', this) is shortcut for selecting the item only if it is a child of the current element

Upvotes: 1

Related Questions