Jump to content

JS To Open Popup In Center Of Screen - Refreshes Page

Recommended Posts

I used some JS that opens a popup in the center of the screen. This script includes functionality for dual screen users, which 95% of my users have. It works awesome, except for one downfall - when you click the popup link, it refreshes the parent page. I usually have my popup links on my results page, so when clicking the popup link it refreshes the results page and kicks the user back to the Search Form. 

I am hoping one of you JS Wizards can help me identify the culprit in the script. Maybe it is obvious, but I personally don't see anything in the script that would cause the parent page to reload... But it only happens when I set the popup button to the OpenPopupCenter function onclick. If I remove this and just use a regular href, it doesn't refresh. 

function OpenPopupCenter(pageURL, title, w, h) {
    // Fixes dual-screen position                                               Most browsers             Firefox
    var dualScreenLeft = window.screenLeft != undefined ? window.screenLeft : window.screenX;
    var dualScreenTop = window.screenTop != undefined ? window.screenTop : window.screenY;

    var width = window.innerWidth ? window.innerWidth : document.documentElement.clientWidth ? document.documentElement.clientWidth : screen.width;
    var height = window.innerHeight ? window.innerHeight : document.documentElement.clientHeight ? document.documentElement.clientHeight : screen.height;

    var systemZoom = width / window.screen.availWidth;
var left = (width - w) / 2 / systemZoom + dualScreenLeft
var top = (height - h) / 2 / systemZoom + dualScreenTop
    var newWindow = window.open(pageURL, title, 'scrollbars=yes, width=' + w / systemZoom + ', height=' + h / systemZoom + ', top=' + top + ', left=' + left);

    // Puts focus on the newWindow
    if (window.focus) newWindow.focus();



Link to comment
Share on other sites

  • 1 year later...

Hi @kpcollier,

The reason why the parent page refreshes every time you open the popup is because of the behavior of button tag. It looks like this tag <button> </button> is acting like a Submit Button. 

To solve this issue, you can use input tag instead:

<input type = "button" value ="Open Details" onclick="OpenPopupCenter('URL', 'test', 500, 500);"></input>

Hope this helps!

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...