I need to differentiate between user driven close of a popup window using X close button and close through code.
var win= window.showModelessDialog("http://localhost/test/test.aspx",'google,....);
//Some manipulations
//Manipulation ends
if(win!=null && win.open)
{
win.close();
}
Now I have full access over test.aspx and test.aspx.cs.I have a onbeforeunload method defined in test.aspx page which will be called either way I close the window(X close or my code gets executed)I basically want to differentiate my X close and programmatic close so that I can do some backend manipulations
Something like this perhaps:
var MyPopup = {
_win : null,
_userClosingWindow : true,
open : function() {
var _this = this;
this._win = window.open(...);
this._win.onbeforeunload = function() {
if( _this._userClosingWindow ) {
// closed by user
}
else {
// closed in code
}
};
},
close : function() {
this._userClosingWindow = false;
this._win.close();
}
};
Then you can use MyPopup.open() and MyPopup.close() and still know when the close function is called or when the popup is closed by the user.
Use Model Popup & include "OK" & "Cancel" Button.
Now you can handle both the "OK" & "Cancel" Button Events.
you can use:
AjaxControlToolkit - ModalPopup
jQuery UI - Dialog
// parent
function closePopup(win) {
win.close();
// do the magic stuff...
}
// popup (test.aspx)
function closeMe() {
self.opener.closePopup(window);
}
Update
As of your comment, just check the closed property of the popup. If it is false, the popup is still open, otherwise it has already been closed
if (win.closed === false) {
win.close();
// do magic stuff here
}
Related
I'm using oAuth to login or sign up using gmail account and decided to use popup window to do it. I found a snippet here which describes the process. But I can't understand how I'll be able to get the values or code if the user logged in with his email.
I can open the modal by this:
//Authorization popup window code
$.oauthpopup = function(options)
{
options.windowName = options.windowName || 'ConnectWithOAuth'; // should not include space for IE
options.windowOptions = options.windowOptions || 'location=0,status=0,width=800,height=400';
options.callback = options.callback || function(){ window.location.reload(); };
var that = this;
log(options.path);
that._oauthWindow = window.open(options.path, options.windowName, options.windowOptions);
that._oauthInterval = window.setInterval(function(){
if (that._oauthWindow.closed) {
window.clearInterval(that._oauthInterval);
options.callback();
}
}, 1000);
};
And use that as follows:
$.oauthpopup({
path: urltoopen,
callback: function()
{
log('callback');
//do callback stuff
}
});
But now, I'm wondering how to auto close the popup and pass parameters from popup window to the main window.
var inFormOrLink;
$('a').on('click', function () { inFormOrLink = true; });
$('form').on('submit', function () { inFormOrLink = true; });
$(window).on('beforeunload', function (eventObject) {
var returnValue = undefined;
if (!inFormOrLink) {
returnValue = "Do you really want to close?";
}
if (returnValue != undefined) {
eventObject.returnValue = returnValue;
return returnValue;
}
});
Ref : Browser close event
I tried to execute the above mentioned code in Chrome Version 65.0.3325.181
it is working properly i.e popup does not open while redirecting or submitting form,
i want to show popup only when user close the tab, sometimes browser shows the popup but sometimes tab gets closed without showing popup.
I don't know why it is happening.
I am using SharePoint 2010 and I have managed to get a list to open within a modal dialog. I am now trying to get another list to open within the same modal dialog when you click a button. (Ideally, close the first dialog then open another)
Here is my modal dialog declaration:
function OpenDialog(url)
{
var dialogOptions = SP.UI.$create_DialogOptions();
dialogOptions.url = url // URL of the Page
dialogOptions.title = 'Dialog Window'
dialogOptions.allowMaximize= true
dialogOptions.width = 635; // Width of the Dialog
dialogOptions.height = 335; // Height of the Dialog
SP.UI.ModalDialog.showModalDialog(dialogOptions); // Open the Dialog
}
function DialogCallback(){
SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.cancel,'Cancelled');
}
So I have managed to close the dialog correctly, but I cant seem to get it to open a new one. Ive used www.google.co.uk as an example, I just need it to open in either the same dialog (replacing whats currently there) or close the current dialog and reopen a new one...
href="#" onclick="window.frameElement.cancelPopUp(); OpenDialog(url);
You forget to option : dialogReturnValueCallback in you Option object.
You can pass a function to this parameter. When to Modal is Closed (ok, cancel ...) this function will be executed.
Do somthing like this :
function OpenDialog(url)
{
var dialogOptions = SP.UI.$create_DialogOptions();
dialogOptions.url = url // URL of the Page
dialogOptions.title = 'Dialog Window'
dialogOptions.allowMaximize= true
dialogOptions.width = 635; // Width of the Dialog
dialogOptions.height = 335; // Height of the Dialog
dialogOptions.dialogReturnValueCallback = Function.createDelegate(null,DialogCallback )
SP.UI.ModalDialog.showModalDialog(dialogOptions); // Open the Dialog
}
function DialogCallback(result, target) {
if (result == SP.UI.DialogResult.OK) {
//Close the Modal with the function : SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.OK, returnValue);
//Here Your First Modal is close normaly, open Your New Modal Dialog
}else if (result == SP.UI.DialogResult.cancel){
//Close the modal with the function : SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.cancel,returnValue);
} else{
//The user have closed the modal with the cross
}
}
So in your Parent page, jsute call :
OpenDialog(url);
In your First Modal, to close normaly the Modal :
SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.OK, "a value to return ...");
And then the DialogCallback function will be executed, and then you can open you new Modal
I have this code in my popup window (which is opened by parent window):
window.onbeforeunload = closeWindow;
function closeWindow(){
}
The problem is that this code fires when parent window is being refreshed. Is there a way for this code only to fire when popup window is actually being closed?
Hmmm. You could try something like this in the window that opens the popup.
var NewWin = window.open("NewWin", "example.htm", "width=100;height=300;");
// modify styling as necessary etc.
NewWin.onbeforeunload = function() {
window.setTimeout(function() {
if (!NewWin) {
// window has been closed
} else {
// false alarm, just a refresh
}
}, 1000);
}
EDIT: To prevent the window from reopening on parent page refresh, use a similar technique from within the popup
window.opener.onload = function() {
window.opener.NewWin = self;
}
Then change the first line of the code above to:
document.onload = function() {
if (!NewWin) { var NewWin = window.open("NewWin", "example.htm", "width=100;height=300;"); }
}
I have a jsp file which calls another jsp file opening it as a showmodal dialog window.
Say file1.jsp calls file2.jsp through file1.js.
File1.jsp-->File1.js (respective js files)
File2.jsp-->File2.js(respective js files)
Now to handleonclose in File2.jsp I added a function in File2.js.
When I hit close window but choose option as cancel, instead of just showing the old window.
It shows a modal window ontop of the existing modal window. Why is this happening. Am I missing something obvious.
What i expect to happen: When I choose Close but click cancel, nothing should happen.
File2.js function:
function handleOnClose() {
var resultsDoc = document.frames('searchBuffer').document;
if (event.clientY < 0) {
var bool = confirm('Are you sure you want to close the window ?');
if (!bool) { //Issue occurs here
window.showModalDialog("File2.jsp", "", "dialogWidth:1000px;dialogHeight:650px");
}
else {
resultsDoc.all('searchResults').innerText = '';
document.someSearch.submit();
}
}
window.returnValue = 'Discard';
}
Modified File2.js function:
function handleOnClose() {
var resultsDoc = document.frames('searchBuffer').document;
if (event.clientY < 0) {
var bool = confirm('Are you sure you want to close the window ?');
if (!bool) { //Issue occurs here
//*******removed the showmodal dialog window call
window.returnValue = 'Sorry';
}
else {
resultsDoc.all('searchResults').innerText = '';
document.someSearch.submit();
window.returnValue = 'Discard';
}
}
}
On the calling js (file1.js) I check if return value is "Discard" if so I refresh the page.
Otherwise I call the showmodal window again. My result is stored in the buffer so retrieval isn't a problem. Works like a charm