PopupCenter by opening new window instead of overwriting the previous one - javascript

Can the PopupCenter function open a new window instead of overwriting the previously opened window? I tried to add target="_blank" but it does not work.
I have the code written as below:
HTML:
Submit Form<br>
View Form<br>
Javascript:
function PopupCenter(url, title, w, h) {
var left = (screen.width - w) / 2;
var top = (screen.height - h) / 2;
var params = "width=" + w + ", height=" + h;
params += ", top=" + top + ", left=" + left;
params += ", directories=no";
params += ", location=no";
params += ", menubar=no";
params += ", resizable=yes";
params += ", scrollbars=yes";
params += ", status=no";
params += ", toolbar=no";
newwin = window.open(url, title, params);
if (window.focus) { newwin.focus(); }
//return false;
}
For instance, the link for submit form and view form will open seperate windows. Is it possible to achieve this? Need some help and thanks in advance.

You just have to give every link a different title
<html>
<body>
xtf<br>
xtf2<br>
xtf3
<script>
function PopupCenter(url, title, w, h) {
var left = (screen.width - w) / 2;
var top = (screen.height - h) / 2;
var params = "width=" + w + ", height=" + h;
params += ", top=" + top + ", left=" + left;
params += ", directories=no";
params += ", location=no";
params += ", menubar=no";
params += ", resizable=yes";
params += ", scrollbars=yes";
params += ", status=no";
params += ", toolbar=no";
newwin = window.open(url, title, params);
if (window.focus) { newwin.focus(); }
//return false;
}
</script>
</body>
</html>
The first two links in my example open in different windows but not the third, because it has the same title as link nr2

Related

How to scroll an element into view inside a window opened with window.open()

this is my code:
var x = 582,y = 500,w = 200,h = 200;
var term = Math.random().toString(16).substr(2, 8);
var win = window.open(`https://www.example.com/search?q=${term}`, "", "width=" + w + ",height=" + h+",status=no");
win.moveTo(x, y);
win.document.scroll(0,findPos(win.document.getElementById("id_rc")));
Works as normal, but when the window is opened, the element is not scrolled into view.
Add your desired ID into URL itself (#id_rc), so that browser would automatically scroll that element to view, just like with normal references in URL:
var x = 582,y = 500,w = 200,h = 200;
var term = Math.random().toString(16).substr(2, 8);
var win = window.open(`https://www.example.com/search?q=${term}#id_rc`, "", "width=" + w + ",height=" + h+",status=no");
win.moveTo(x, y);

Authentication Javascript with Spotify Web API

I need to authenticate in Spotify Web Api without dialog text for approved, or load in a complete page and after load a page with results.
My code:
function login(callback) {
var CLIENT_ID = 'ID CLIENT';
var REDIRECT_URI = 'REDIRECT URI';
function getLoginURL(scopes) {
return 'https://accounts.spotify.com/authorize?client_id=' + CLIENT_ID +
'&redirect_uri=' + encodeURIComponent(REDIRECT_URI) +
'&scope=' + encodeURIComponent(scopes.join(' ')) +
'&response_type=token';
}
var url = getLoginURL([
'playlist-modify-public'
]);
var width = 450,
height = 730,
left = (screen.width / 2) - (width / 2),
top = (screen.height / 2) - (height / 2);
window.addEventListener("message", function(event) {
var hash = JSON.parse(event.data);
if (hash.type == 'access_token') {
callback(hash.access_token);
}
}, false);
var w = window.open(url,
'Spotify',
'menubar=no,location=no,resizable=no,scrollbars=no,status=no, width=' + width + ', height=' + height + ', top=' + top + ', left=' + left
);
}

Why are my pictures not opening in a separate window?

Heres the Javascript code:
function showCard(linkTarget) {
var propertyWidth = 400;
var propertyHeight = 350;
var winLeft = (screen.width-propertyWidth)/2;
var winTop = (screen.height-propetyHeight)/2;
var winOptions = "toolbar=no,menubar=no,location=no,scrollbars=yes,resizable=no";
winOptions += ",width=" + propertyWidth;
winOptions += ",height=" + propertyHeight;
winOptions += ",left=" + winLeft;
winOptions += ",winTop=" + winTop;
cardWindow = window.open(link.target,"cardInfo", winOptions);
cardWindow.focus();
}
var cardWindow;
href="valentine.jpg" onclick="showCard('valentine.jpg');return false">Valentine's Day
(I removed the tags because the code is not showing up with them)
window.open(link.target...) should be window.open(linkTarget...)
This is causing an error, so the return false; is never reached and the link navigates as normal.
Looks to me like your problem is here:
Your function is declared as:
function showCard(linkTarget)
but you refer to the parameter passed in later in the code with a dot as
cardWindow = window.open(link.target,"cardInfo",winOptions);

open window on click of button as modal dialog using javascript

I have to open a window when a button is clicked, as a modal dialog using JavaScript.
I have used window.open, but it shows me two instances, the parent page and the pop-up page.
When the pop-up page is open, then do not allow the user to click on the parent page.
function openWindow() {
var w = 950;
var h = 350;
var t = 0;
var l = 0;
var scrollbars = 1;
var modal = 'yes';
var reportWindow = window.open("Search.aspx" + '', '', "width=" + w + ",height=" + h + ",left=" + l + ",top=" + t + ',scrollbars=' + scrollbars + 'modal' + modal);
reportWindow.focus();
}
Your code line,
reportWindow = window.open("Search.aspx" + '', '', "width=" + w + ",height=" + h + ",left=" + l + ",top=" + t + ',scrollbars=' + scrollbars + 'modal' + modal);
is missing an '=' symbol after modal. It should be,
reportWindow = window.open("Search.aspx" + '', '', "width=" + w + ",height=" + h + ",left=" + l + ",top=" + t + ',scrollbars=' + scrollbars + 'modal=' + modal);
To open window as dialog box,
<html>
<body>
<script language="JavaScript">
function openWindow() {
if (window.showModalDialog) {
window.showModalDialog("http://example.com","name",
"dialogWidth:255px;dialogHeight:250px");
} else {
window.open('http://example.com','name',
'height=255,width=250,toolbar=no,directories=no,status=no, linemenubar=no,scrollbars=no,resizable=no ,modal=yes');
}
}
</script>
<button onclick="openWindow();">Open window</button>
</body>
</html>
If the above code is not working, please use jQuery modal dialog. You can load any urls to dialog using an iframe.
"window.open" will not work. This command always just opens a popup wich is not "always" on top of its parent.
2 Options:
If you just want to let the user enter a search string you could use
prompt("Please enter a search string:", "");
If you have a complexe search form, you have to create a modal dialog for your own.
There are frameworks which provide this functionality (google for "jQuery") or you create it for your own. Should not be hard, tell me if you need some help!

ASP.NET Javascript: window.open won't work twice

I have an aspx page with a button. When the user clicks that button, the following javascript opens a new browser window (in this case, 'Reasons.aspx'). Works great. Here's the function for that part:
function ShowPanel(url)
{
var width = 750;
var height = 600;
var left = (screen.width - width) / 2;
var top = (screen.height - height) / 2;
var params = 'width=' + width + ', height=' + height;
params += ', top=' + top + ', left=' + left;
params += ', toolbar=no';
params += ', menubar=no';
params += ', resizable=yes';
params += ', directories=no';
params += ', scrollbars=no';
params += ', status=no';
params += ', location=no';
newwin = window.open(url + '?LetterNumber=1&ReasonType=3', 'd', params); //<--- Change This (LetterNumber) When Copying!
if (window.focus)
{
newwin.focus()
}
return false;
}
Now here's where it gets funky. When this window pops up, there are some controls. One of which is a button, which triggers almost identical code to popup a third window (in this case, ReasonCodes.aspx). Only it won't work. Here's the code for that:
function fGetReasons(url)
{
var width = 750;
var height = 600;
var left = (screen.width - width) / 2;
var top = (screen.height - height) / 2;
var params = 'width=' + width + ', height=' + height;
params += ', top=' + top + ', left=' + left;
params += ', toolbar=no';
params += ', menubar=no';
params += ', resizable=yes';
params += ', directories=no';
params += ', scrollbars=no';
params += ', status=no';
params += ', location=no';
newwin = window.open(url, 'd', params); //<--- Change This (LetterNumber) When Copying!
if (window.focus)
{
newwin.focus()
}
return false;
}
I've set breakpoints on the javascript. It does execute. Here's what's weird -- The above javascript executes, only I don't get a new window with ReasonCodes.aspx. However, I set a breakpoint in the page_load of ReasonCodes.aspx and all of it executes. So the javascript executes, the code-behind page_load of the third page executes, but I don't get a third page.
Instead, the second window (Reasons.aspx) refreshes. It's like my third window is somehow 'hidden'.
Can anybody tell me what's going on, or what am I missing?
Thanks,
Jason
PS -- I know 3 windows sounds like a lot, and it's not by choice. There's a business need here (this is a local intranet application) and I have to abide by the specs. Thanks.
The 2nd parameter to window.open is the name of the window. You are using the same name in both calls so it is attempting to use the same window. Change the name of the 2nd call and you should be fine.
Or use '_blank' name to open each time in new window!

Categories

Resources