I'm using ajax for some function for my website, in success function I write some code:
success: function(html) {
window.open("http://localhost/demo/index.php",'name','height=243,width=800');
}
There are some problems I met:
This page (popup window) can not load css
I can disable main browser
I want to redirect main window after popup window is closed
How can I do that?
P/S: If I can't do that, how do I display popup when success function is called?
1. This page (popup window) can not load css
There might be some problem with your style urls. Check them in browser console.
2. I can disable main browser
You can't disable main browser, but As per my understanding you are trying to block page elements. So block UI can help. Use block UI to block your page contents and it will be automatically removed when you will redirect your main page.
3. I want to redirect main window after popup window is closed
You need to bind a custom redirect method to your window close to redirect your main page when window is closed.
success: function (html) {
myWindow = window.open("http://localhost/demo/index.php", 'name', 'height=243,width=800');
myWindow.onbeforeunload = function () {
return RedirectPage();
}
function RedirectPage() {
window.location.location.href = "http://www.yoursite.com";
}
You can redirect main window using:
window.parent.location.href = "http://www.site.com";
Regarding popup window not loading css, it might be issue with improper CSS include URL's in popup page html.
Related
I have implemented some form processing using jquery and in some circumstances more information is needed in which case I open a new page in fancybox as shown:
moreInfoNeeded = checkInfoComplete();
if (moreInfoNeeded) {
$.fancybox.open({
href : 'iframe.html',
type : iframe,
padding : 5
});
// We need to pause execution here until fancybox is closed.
}
// Once fancybox has been closed we have all the information so can continue.
$.ajax({
...
success: function(data)
{
window.location.replace(data);
}
});
How do I suspend the execution of the script whilst the fancybox window is open? At the moment the code above starts to open the fancybox window with the iframe in it but the redirect using window.location.replace occurs and closes the fancybox window in the process.
Thanks,
Andy.
I have a url that I want to load in an iframe that's inside a pop-up window. The parent window has a script that inserts a script to the pop-up window so that it the popup will refresh the parent window when the pop-up is closed.
function popUp(url) {
newwindow = window.open('', 'mypopup', '');
var tmp = newwindow.document;
tmp.write('<!DOCTYPE html><html><head><title>My Pop-Up</title></head>');
tmp.write('<body><iframe src="' + url + '" scrolling="no" frameborder="0"></iframe>');
tmp.write('<script type="text/javascript">window.onunload = function(){ window.opener.location.reload(); }</script></body></html>');
tmp.close();
}
I chose to write the html via javascript because I can't edit the page being loaded (I need to really reload the parent when the pop-up is closed.) This works on chrome and firefox but IE has an error 'SCRIPT5: Access is denied.' I'm not trying to access any part of the page that is being loaded in the iframe, I just want to load it.
When I open the page in a new IE tab, it loads fine. Also, if I load the url via showModalDialog(), the page loads. I wish I could just use showModalDialog() but when the save button is clicked on the pop-up page, another pop-up opens so I guess that's out of the question.
Help would be greatly appreciated.
Thank you :)
Well, if you want to check only when the pop up is closed then you can initiate external timer to check this:
var checkPopup = window.setInterval(function() {
if (newwindow.closed) {
window.clearInterval(checkPopup);
document.location.reload();
}
}, 100);
This way you don't rely on fancy scripting inside the pop up itself.
I am working with IE9. Want to open a popup window from a page, and from the popup, how to call the javascript code in the page (not the popup window)?
There will not be a cross domain issue as I am going to load a page from the same domain of the page into the popup window.
Like Cory said, use window.opener to get the parent window's window. Look at this:
http://jsfiddle.net/Dmnqk/
function openPopup() {
var w = window.open("", "");
w.document.open();
w.document.write("<script type='text/javascript'>window.opener.parentWindowFunction();<\/script>");
w.document.close();
}
function parentWindowFunction() {
alert("called");
}
Of course, my use of document.open/write/close is simply to create my own page that calls the parent window's function (technically, it should really have <html><head></head><body>SCRIPT HERE</body></html>. All your popup's page would need is the call to window.opener.parentWindowFunction.
You can use window.opener to access functions in the global (window) namespace of the page that opened the popup:
Opener
function functionFromOpener() {
return "wharrgarbl";
}
Popup
alert(window.opener.functionFromOpener());
Obligatory jsFiddle example: http://jsfiddle.net/9yLu2/1/
That said, I think it's a better idea to use in-page DHTML dialogs. (Or possibly it's that browser windows that aren't resizeable / don't have address bars bug me that much.)
I'm showing the pop-up window from the page. The popup has one page, which then redirects to another (LinkedIn authorization one, to be clear), and then, after the successful login, the initial authorization page is opened again.
I want to reload the parent page when the popup is closed, but cannot do this.
The code is the following:
function OpenAuthorizePopUp() {
var w = window.open("AuthorizePage.aspx", "PopUp", "width=450,height=540");
w.onunload = function () {
SubmitPage();
};
return false;
}
function SubmitPage() {
alert("SUBMIT!");
}
The issue here is that SubmitPage() function is called not when window is closed, but just after the popup is shown. I guess it's because of redirect inside the popup, and unload is raised when we move from the first page.
Is there a way to catch the actual moment when the window is closed in this case?
So the flow of the popup goes like this:
1. Your page -> 2. LinkedIn Page -> 3. Your Page
Can you change the URL that LinkedIn sends you back to (3.) ? If so, have LinkedIn send you back to a page that has window.onunload = window.parent.SubmitPage; on it.
If you can't- ie, LinkedIn always sends you back to the first page- make the third page test for a successful connection to LinkedIn and if it's present, execute window.onunload = window.parent.SubmitPage;.
A possible improvement to your idea would be to just have the "success" page call window.parent.SubmitPage(); and then window.close(); since you won't need the popup anymore.
Found the solution. Instead of accessing parent window with window.parent, wrote
opener.location.reload(true);
And it works.
We currently have two asp.net 2.x web applications and we need to perform the following functionality:
From one application, we want to auto-login to the other web application automatically in a new tab; using the same browser instance/window.
So the process is:
Open New Window/Tab With Second System URL/Login Page
Wait For Popup Window/Tab Page To Load (DOM Ready?)
OnPopupDomReady
{
Get Usename, Password, PIN Controls (jQuery Selectors) and Populate In Code Then Click Login Button (All Programmatically).
}
I am currently using JavaScript to Open the window as follows:
<script type="text/javascript">
$(document).ready(function () {
$('a[rel="external"]').click(function ()
{
window.open($(this).attr('href'));
return false;
});
});
</script>
I would like to use jQuery chaining functionality if possible to extent the method above so that I can attach a DOM Ready event to the popped up page and then use that event to call a method on the code behind of the popped up page to automatically login. Something similar to this (Note: The following code sample does not work, it is here to try and help illustrate what we are trying to achieve)...
<script type="text/javascript">
$(document).ready(function () {
$('a[rel="external"]').click(function () {
window.open($(this).attr('href').ready(function ()
{
// Use JavaScript (Pref. jQuery Partial Control Name Selectors) To Populate Username/Password TextBoxes & Click Login Button.
})
});
});
</script>
Our architecture is as follows:
We have the source for both products (ASP.NET WebSite[s]) and they are run under different app. pools in IIS.
When you open a window with window.open, the new window gets a property called window.opener which references the parent window. So code in your child window can call functions in the parent window, for instance:
In Window A:
// Declared at global scope => ends up as property on `window`
function phoneHome(str) {
alert(str);
}
In Window B (the child window):
$.ready(function() {
if (window.opener && window.opener.phoneHome) {
window.opener.phoneHome("Hi, Ma!");
}
});
(Using $.ready in the child window requires that the child window have jQuery loaded.)
In the above all I've done is have the child window trigger a function in the parent window with a message, but of course the function call can carry any data you want it to.