CODEWITHSUNDEEP
jqueryjquery-uijquery-ui-dialog
user1555112
user1555112

Reputation: 1977

Dialog close event not firing

This is not working like I expect it:

$("#generalContactWindow").dialog({
    autoOpen: false,
    draggable: true,
    width: 600, height: 'auto',
    closeOnEscape: true,
    modal: true,
    resizable: false,
    close: function(event, ui) {
        _gaq.push(['_trackEvent', 'DetailsGeneralForm', 'HideForm', document.location.href]); 
        console.log('_trackEvent DetailsGeneralForm HideForm called');
    }
});

The part with _gaq.push(['_trackEvent', 'DetailsGeneralForm', 'HideForm', document.location.href]); will never happen if I click on the close button or press escape key.

The close link looks like this:

<a class="ui-dialog-titlebar-close" href="#" unselectable="on" style="-moz-user-select: none;"><span unselectable="on" style="-moz-user-select: none;">X</span></a>

I think this is the standard.

Reason for all this is that I need to track the opening and the closing of the dialog. I can track the opening quite well, but just not the closing. What should I do?

Thanks in advance!

Upvotes: 0

Views: 3205

Answers (1)

MikeM
MikeM

Reputation: 27405

you'll need to setup the click event for your close button

jsfiddle example

using jQuery .on() delegation this will make your close button call the jquery UI dialog close event

$("#generalContactWindow").on('click', '.ui-dialog-titlebar-close', function() {
    $("#generalContactWindow").dialog('close');
});​

Upvotes: 1

Related Questions