I call below javascript on click of link/textbox or button.
function OpenPopupLinkRisk(Number)
{
window.open("../PopUp.aspx?id=" + Number, "List", "scrollbars=no,resizable=yes,width=700,height=450");
return false;
}
I donot want user to do anything else until he closes the popup window. So how can I grey background and force user to first close the popup and then do any other activity on application.
Can anyone suggest me how to achieve this ?
Thanks !
First of all, i would really disrecommend using window.open for this unless you really need a new browser popup window. If you want to stick with it persee, then will have to use a timer or something to manually check when the window is closed like:
var popup = window.open('http://www.example.com', 'example', '');
var timer = setInterval(function() {
if(window.closed) {
clearInterval(timer);
alert('Closed alright');
}
}, 100);
Else, check some tutorials on the subject, Modal Popup
First a direct solution to you problem that I wouldn't advice using it an then an approach you should be taking and is better from usability as well as security point of view.
Check whether popup window has closed
// mask your page
mask();
// open popup
var popup = window.open("../PopUp.aspx?id=" + Number);
// check whether it's been closed
function check()
{
if (popup && !popup.closed)
{
setTimeout(check, 1000);
}
// unmask your page
unmask();
}
check();
Modern (and better) alternative
Using window.open is a bad solution because it's a security risk and popup blockers prevent sites to open new windows. It's also considered bad practice.
A much better modern alternative is to display the new page as modal window inside your page directly. This will not open new windows and users stay as they are.
There are tons of javascript plugins for modal windows. Make a Google search.
Related
I am creating a exam portal and I want to create a window which is full screen so that the chances of malpractices can be reduced. I don't know how to do it
You cannot force full screen permanently on a browser, for somewhat obvious reasons (imagine a spam website abusing it). However, what you can do, is detect a blur event on the window and open another window alerting the user to return to the test.
Just add this javascript:
var myWindow
window.addEventListener("blur", function(){
refocusWindow()
})
window.addEventListener("focus", function(){
myWindow.removeEventListener("blur", refocus)
myWindow.close()
})
function refocusWindow(){
myWindow=window.open("", "myWindow")
myWindow.addEventListener("blur", refocus)
}
function refocus(){
myWindow.close()
setTimeout(function(){
if (document.visibilityState!="visible"){
refocusWindow()
}
},1)
}
Note that the page opened will be blank - you can change it by writing in HTML using myWindow.document.write("HTML code in string format")
I have a window I'm opening with a Javascript function:
function newwindow()
{
window.open('link.html','','width=,height=,resizable=no');
}
I need it that once the new window opens that the focus returns to the original window.
How can I do that?
And where do I put the code - in the new window, or the old one?
Thanks!
This is known as a 'pop-under' (and is generally frowned upon... but I digress).. It should give you plenty to google about
You probably want to do something like:
var popup = window.open(...);
popup.blur();
window.focus();
Which should set the focus back to the original window (untested - pinched from google). Some browsers might block this technique.
After calling window.open, you may try to use
window.resizeTo(0,0);
window.moveTo(0,window.screen.availHeight+10);
this way can not really open window in background, but works in similar way. Chrome works fine, did not try other browser.
If Albert's solution doesn't work for you and you actually want the window visible, but to be opened behind the current window, you can try opening a new tab in the opener window and closing it right away, this will bring the focus back to the opener window.
window.open('link.html','','width=,height=,resizable=no');
window.open().close();
However, I believe whether the second window opens in a tab or a new window depends on your browser settings.
Please don't use "pop-unders" for evil.
You can use either
"blur" or
"focus" to do that required action.
"blur"
function newwindow()
{
var myChild= window.open('link.html','','width=,height=,resizable=no');
myChild.blur();
}
"focus"
function newwindow()
{
window.open('link.html','','width=,height=,resizable=no');
window.focus();
}
Put the code in your parentWindow (i.e. the window in which you are now)
Both will work.
tl;dr - in 2022 - ctrl/cmd clicking on a button and window.open(url, "_blank") in a javascript button handler's for loop will open multiple tabs in the background in Chrome.
I'm looking for this as of 2022 and none of the answers here worked (here and everywhere else I looked). My use case is clicking a button in a (progressive) web app which opens deep links to items in a list in background tabs (i.e. not "for evil").
It never occurred to me that ctrl/cmd + clicking on the button would open tabs in the background, but it does just as if the user clicked on an anchor tag itself directly - but only in Chrome. Combined with Chrome's relatively recent tab grouping feature, this can be very useful inside PWAs.
const isMozilla =
window?.navigator?.userAgent?.toString().toLowerCase().includes('firefox') ?? false;
for (let index = 0; index < urls.length; index++) {
const url = isMozilla ? urls.reverse()[index] : urls[index];
window.open(url, "_blank");
}
Note: I reverse() the array on Mozilla to get the order of newly created tabs as the user would expect them.
You can just use '_self'. It will be stay to the same page an
window.open(url, '_self');
The problem I am facing is in the scenario that one opens my site in a browser and eventually on clicking a link through open.window() method another window of the same domain is opened. Probability of user staying in both the windows are equal. Now I want to detect which window the user is in and throw a javascript popup there. Though the code must be in the parent window. I have tried window.opener() method but it is of no help. Please help.
I have edited a lot and put it here for demo.
setInterval((function(){
$("div.mask").css("display","");
}),10000);
$("div.mask,div.close").click(function(event) {
var $target = $(event.target);
if ($target.hasClass("mask") == true
|| $target.hasClass("close") == true) {
$("div.mask").css("display","none");
};
});
Now I want the masked popup to come at the top of all windows opened. Can we add .focus() to popup in jQuery?
I don't think you can know where the user "stays in". Better call your popup function in both windows. Just call your function and the popup will be opened where from it was called.
Anyway, I don't understand very well why you need to know which window the user is facing and what will open the popup.
I have the following, rather simple function:
function takeFocus() {
setTimeout(function(){window.focus();alert("OK");},1000);
}
This is within the JavaScript of a window I have opened from another window.
When the user re-opens the sub-window, I want to switch to it, and bring it to the front, without reloading it. Calling takeFocus() as above works just fine, but it throws up the prompt, which I don't want.
When I remove the alert, the background window stays in the background! How can I make it work?
I have tried all sorts of ways to do this, and so far I have failed.
jQuery is available. Writing for modern browsers in HTML5.
Is this code in the sub-window file?
Try use the focus in the main page like this:
function newPopup(url) {
popupWindow = window.open(
url,'popUpWindow3','height=500,width=900,left=10,top=10,resizable=yes,scrollbars=yes,toolbar=no,menubar=no,location=no,directories=no,status=no');
popupWindow.focus();
}
I have half an answer. By using this code to open the window, I get the behaviour I need in Chrome. Sadly FireFox 23.01 and IE 10 are still ignoring the win.focus().
function openWin(ID) { // open workshop ID in another window
var URL = '/chatroom.php?ID='+ID;
var name = 'Chat'+ID; // so if you open it twice it reopens the window.
var win = window.open('',name); // no URL - won't refresh
if (win.location == "about:blank") { // new open
win.location.href = URL;
windows[windows.length] = win; // store for later.
}
win.focus();
}
FF and IE open the window OK the first time, and they don't refresh and lose the data on the second pass, but they don't bring it to the foreground either :(
I'm looking for close event for popup. I've found one for XUL, but I need it for HTML.
Popup has closed property.
>>> var popup = open('http://example.com/', 'popup', 'height=400,width=500');
>>> popup.closed
false
Well, I can check it once at half second.
function open_popup() {
var popup = open('http://example.com/', 'popup', 'height=450,width=450');
var timer = setInterval(function(){
if (popup.closed) {
alert('popup closed!');
clearInterval(timer);
}
}, 500);
}
I've tested it on Chrome 4.0.249.27, Opera 10.10, Safari 4.0.4, and Firefox 3.5.5. All works fine.
But setInterval bother me. It is ugly. Is there a better way of doing this?
UPDATE:
I use popups for authentication dialog (oAuth, actually). I wanna send some data to parent window after popup close (through postMessage).
Page inside popup from another domain. So, I can not add any event (unload) to it due security restrictions.
I can not use iframe due to iframe buster script. So, I can not use any fancy jQuery modal dialogs.
I can not edit anything inside popup.
You might want to look into the unload event, take a look at Javascript: Popups
edit: as you've said you cannot edit anything inside the popup, there really aren't any options left. I believe your current setInterval code does the job just fine. You should ask yourself if realtime detection of the popup closing is absolutely critical. That 500 milliseconds timer certainly won't strain hardly any resources or bring someones computer to its knees.
I have used jQuery Dialog and it has a close event
http://jqueryui.com/demos/dialog/.
Am not sure if I understand your question right,why do you want to use the timer ?
Use window.opener in the pop-up window. i.e. something like:
onunload = opener.alert('popup closed');
or
onunload = opener.nameOfAFunction();