Jquery-Ui-Dialog - How to Hook into Dialog Close Event

jquery-ui-dialog - How to hook into dialog close event

I have found it!

You can catch the close event using the following code:

 $('div#popup_content').on('dialogclose', function(event) {
     alert('closed');
 });

Obviously I can replace the alert with whatever I need to do.

Edit: As of Jquery 1.7, the bind() has become on()

How can I add a handler to jquery UI dialog close event

You can bind close event like,

$( ".selector" ).dialog({
   close: function( event, ui ) {}
});

Read close-event

jQuery UI Dialog - halt close event

Yes, you can use the beforeClose option. From the docs:

This event is triggered when a dialog attempts to close. If the beforeClose event handler (callback function) returns false, the close will be prevented.

Code examples

Supply a callback function to handle the beforeClose event as an init option.

$( ".selector" ).dialog({
   beforeClose: function(event, ui) { ... }
});

jQueryUI Dialog box closing on Button Click

After some research I found that clicking any button in the dialog submits that form. By adding event.preventDefault() as the first line in the required method/s, the button does what I want without submitting and closing.

Related Post: Here

Thanks for trying - G

How to re-assign jQueryUI Dialog close button event

You can bind to the close event and do your logic in there:

$('#dialogID')
        .dialog({ 
            autoOpen: true
        }).bind('dialogclose', function(event, ui) { /* Do position logic here */ });

I didn't test this code so not sure if you will manually have to call close in order to hide the dialog. If so just add in this line:

$('#dialogID').dialog("close");

Also remember that this close function will be called if the 'X' in the upper right corner of the dialog is clicked as well.

---

Related Topics