Question

HTML

<div class="dialog"></div><div class="mydialog"></div>

// global bind of dialog class – general purpose

$('.dialog').dialog({open: function() { alert(1); }});

// specific page

$('.mydialog').dialog({open: function() { alert(2); }});

it seems the specific page open function isn’t getting called. how do i call the parent’s open and then the child’s open (aka, mydialog)?

so i want the output to be alert(1) then alert(2). mydialog’s open function isn’t getting called at all.

Answer 1

$(function(){
    $('.dialog').dialog({open: function() { alert(1); }, autoOpen:false});
    $('.mydialog').dialog({open: function() {$('.dialog').dialog('open'); alert(2); }});
});

Working demo: http://jsfiddle.net/AlienWebguy/UdrvD/1/

You can see I added autoOpen:false to the global .dialog config to demonstrate how the .mydialog can trigger the event