Member Avatar for Xessa

Hello people. I have a pop up window and i have 2 pages that open the same pop up window.

I want to make a button hidden when one specific page opens my pop up. If the other page opens my window; i want the button to be there and not to be hidden.


Also how can i learn which page opened my popup in the js file of the popup?

Like the relative path of the opener.

I know things will be easier if i can know the path so i can hide or unhide the button just with an if block.

Any suggestions please?

  • 3 Contributors
  • 2 Replies
  • 114 Views
  • 3 Days Discussion Span
  • Latest Post Latest Post by Krishna_vs

Dani AI

Generated

Good suggestions so far from (callback approach) and (use of window.opener). Both are valid; which to use depends on same-origin access and how robust you need the solution to be.

A very reliable, simple pattern is to let the opener identify itself in the popup URL. Open the popup with an explicit query/hash like popup.html?from=pageA and then read that value inside the popup. Example (popup side only):

function getQueryParam(name){
  var re = new RegExp('[?&]' + name + '=([^&]*)');
  var m = re.exec(location.search);
  return m ? decodeURIComponent(m[1]) : null;
}

var from = getQueryParam('from'); // 'pageA' or null
if (from === 'pageA') {
  // hide the button
}

If you must detect the opener programmatically, check window.opener but do it safely: reading opener.location across different origins will throw. Wrap access in try/catch, check opener.closed, and fall back to a safe channel such as postMessage when origins differ. Minimal patterns:

// safe read (popup)
var openerPath = null;
if (window.opener && !window.opener.closed) {
  try {
    openerPath = opener.location.pathname; // may throw if cross-origin
  } catch (e) {
    openerPath = null;
  }
}

Or use postMessage for cross-origin messaging: opener sends a short message telling the popup which UI state to use, and the popup listens with window.addEventListener('message', ...).

Notes and gotchas: modern security (rel="noopener" or using noopener) will make window.opener null; named-window reuse can leave an old opener attached; always validate the origin or token you receive before acting. See MDN for details on Window.opener, the Same-origin policy, and window.postMessage for secure cross-window communication.

Recommended Answers

All 2 Replies

Member Avatar for Airshow

Xessa,

This is very simple, though maybe not obvious.

First create a funtion in your main page

function popUpCallback(x){
	var b = document.getElementById('b1');//the button that you want to hide/show
	if(b) { b.style.display = (x) ? 'inline' : 'none'; }
	//Add/modify this function to do whatever you want in the main page.
}

Then, in each of the popup pages that you want to suppress your button:

onload = function(){
	opener.popUpCallback(0);
}
onunload = function(){
	opener.popUpCallback(1);
}

Here, I just pass back binary 0|1 but you could pass anything you like to the the main page and test/act accordingly in popUpCallback.

This scheme will still work if another page is served into the main window, as long as it (a) is from the same domain and (b) contains the popUpCallback fn.

Tested in IE6 and FF 3.0.12

Hope this helps

Airshow

commented: thank you. i will try this tomorrow +2
Member Avatar for Krishna_vs

I think you will get the reference to the parent window using script like

<script type="text/javascript">
function openWin()
{
        myWindow=window.open('<url>','<name>','<properties>');      //it will giv U a child window
        parent_obj=[B]myWindow.opener[/B];        // This one will give you the ref. to the parent window
}
</script>

All the best dear friend....

with thanks regards
Krishnan

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.