Question

I have a Jquery dialog set up with id as below.

In document.ready

$('#modal-id').dialog({ autoOpen: false, ...... })

and in html

<div id="modal-id">
<div class="modal-content">
.....
</div>
</div>

Now I need to bind the open event of the dialog.

$( "#modal-id" ).bind( "dialogopen", function(event, ui) {
....
});

The above works but the below doesn’t work

$( ".ui-dialog-content" ).bind( "dialogopen", function(event, ui) {
...
});

Any suggestions are greatly appreciated.

Update:

$( ".ui-dialog" ).live( "dialogopen", function(event, ui) {
$.getScript("/common/js/jquery.curvycorners.min.js", function() {
});
});

Answer 1

First, I don’t think the class you want is .ui-dialog-content, but ui-dialog (I might be mistaken though). My suggestion would be to use the on method (or live if using an old jQuery):

$(document).on("dialogopen", ".ui-dialog", function(event, ui) {
    ...
});

Working example at jsFiddle.