Reputation: 177
What is the best way to display different content in the same pop up window.
I'm doing the following:
<a href = "javascript:openWin('content1.htm')">Content 1</a>
<a href = "javascript:openWin('content2.htm')">Content 2</a>
<a href = "javascript:openWin('content3.htm')">Content 3</a>
And I have the following javascript:
function openWin(url) {
window.open(url, "_blank", "toolbar=no, scrollbars=no, resizable=no, top=200, left=300, width=870, height=650");
}
Now, after clicking each link, different pop ups opened. How can I target the same pop up window to display appropriate content, so I have only one pop up opened after clicking second or third link?
Thank you
Upvotes: 1
Views: 5613
Reputation: 35
A tad late, but I think using the 'location' property will do what you want:
var windowName; // global
function openWin(url) {
if (windowName) {
windowName.location = url;
return;
}
else {
windowName = window.open(url, "window_name", "<feature_list>");
}
}
I was researching this topic because my users want to have an app open on two different windows on different monitors, each window/monitor dedicated to different content within the app itself. The above code opens up new content in the same window, but there's no "flash" or "pop" that tells the user new content has appeared. CSS could certainly be used for this, but compare how the above code executes compared to this code:
var windowName; // global
function openWin(url) {
if (windowName) {
windowName.close();
}
windowName = window.open(url, "window_name", "<feature_list>");
}
I think I like the latter UX better.
Upvotes: 0
Reputation: 3212
Really easy, you are creating new popup windows because you are specifying "_blank"
as argument, change it to a name and you'll open in the same window as long it's open.
function openWin(url) {
window.open(url, "samewindow", "toolbar=no, scrollbars=no, resizable=no, top=200, left=300, width=870, height=650");
}
Upvotes: 2