close jqxwindow on click outside of window

[wpdParticipant]

Hello,

I am working on jqxWindow and not able to find how to close window on click outside of window. I looking for the similar functionality as jqxpopup has autoClose which will close the popup on outside click.

[Peter StoevKeymaster]

Hi wpd,

You can use the “close” method of the window to close it.

$('#jqxWindow').jqxWindow('close');

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[wpdParticipant]

How can i know if user clicked on outside window?
how to attach it to my jqxWindow? do you have any working example or sample code?

[wpdParticipant]

I have a code in the below format
<div id=’jqxwindow’>
<div>Header</div>
<div>Content</div>
</div>

$(‘#jqxwindow’).jqxWindow({
theme: ‘energyblue’,
isModal: true
});

so i want to close that window when user clicks outside of window

[Peter StoevKeymaster]

Hi wpd,

Bind to the mousedown or click of the document and the event.target argument gives you the clicked html element. If it is not the window or a child element of the window, then call the “close” method.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[wpdParticipant]

Hi,

I tried with the below code but did not help me

$(document).click(function (e)
{

var container = $(“#channelEditingWindow”);

if (!container.is(e.target)
&& container.has(e.target).length === 0)
{

$(‘#channelEditingWindow’).jqxWindow(‘close’);
}
});

Please let me know if i need to change any thing in above code

[Peter StoevKeymaster]

Hi wpd,

I prepared an example: http://jsfiddle.net/uatb0bab/

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[wpdParticipant]

Yes code works perfectly if jqxwindow is not modal
$(‘#jqxwindow’).jqxWindow({
theme: ‘energyblue’,
isModal: true
});
$(document).click(function(e) {
var container = $(‘#jqxwindow’);
if (!container.is(e.target) && container.has(e.target).length === 0) {
container.jqxWindow(‘close’);
}
});

it does not work with the above code

[Peter StoevKeymaster]

Hi wpd,

The whole idea of the MODAL Windows is to disable clicking outside the Window. If you want clicking to be enabled, then why do you make a Modal Window?

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[wpdParticipant]

My requirement says it should look like modal window and should close when clicked outside

[Peter StoevKeymaster]

Hi wpd,

Ok. See: http://jsfiddle.net/htxpf29z/

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[wpdParticipant]

Thank you it is working as expected

[Author]

Posts