Reputation: 7682
Using UI dialog. jquery 1.4.2
I have my code to close a dialog when clicked outside. This doesn't work for me. However, if I up the version on a local development, it works fine. The issue is, that I can't up the jquery version for this part of the site.
Thoughts on how to achieve clicking outside a non-modal dialog to close?
// Close Pop-in If the user clicks anywhere else on the page
jQuery('body')
.bind(
'click',
function(e){
if(
jQuery('.detailsPopup').dialog('isOpen')
&& !jQuery(e.target).is('.ui-dialog, a')
&& !jQuery(e.target).closest('.ui-dialog').length
){
jQuery('.detailsPopup').dialog('close');
}
}
);
Upvotes: 1
Views: 4932
Reputation: 21
$(document).click(function(e) {
if (e.target.classList.contains('ui-widget-overlay'))
{
$( "#yourDialogId" ).dialog("close");
}
});
Upvotes: 0
Reputation: 14435
You can try this:
http://jsfiddle.net/GKfZM/117/
It is running 1.4.4 but give it a try. Works for autoOpen
true or false.
$('#open').click(function() {
$('#your-dialog-id').dialog('open');
closedialog = 0;
});
var closedialog;
function overlayclickclose() {
if (closedialog) {
$('#your-dialog-id').dialog('close');
}
//set to one because click on dialog (focus) box sets to zero
closedialog = 1;
}
$('#your-dialog-id').dialog({
autoOpen: false,
open: function() {
closedialog = 1;
$(document).bind('click', overlayclickclose);
},
focus: function() {
closedialog = 0;
},
close: function() {
$(document).unbind('click');
},
buttons: {
Submit: function() {
$(this).dialog('close');
}
}
});
Upvotes: 1