Link to home
Start Free TrialLog in
Avatar of Mark Franz
Mark FranzFlag for United States of America

asked on

window.name Not Passing Value on Window.Open Call

I am trying to pass a var using the window.name parameter in this code, but it is not being picked up in the new popup window.  Here is my parent page;

<div id="superman">
    <table border="0" cellpadding="0" cellspacing="0">
        <tr>
            <td>Name:&nbsp;
            </td>
                <a href="#" onclick="SelectName.call(superman)">Adjust</a>
            </td>
        </tr>
    </table>
    </div>
    <script type="text/javascript">
        var popup;
        function SelectName(divId) {
            var myId = document.getElementById(divId).id; 
            //alert(myId);
            popup = window.open("Popup.htm", myId, "width=300,height=100");
            popup.name = myId;
            popup.focus();
        }
    </script>

Open in new window


And here is my popup code;
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        var myId = popup.name;
        alert(myId);
    </script>
</head>
<body>
    <br />
    <input type="text" id="newPos" />
    <br />
    <input type="button" value="Select" onclick="SetName();" />
    <script type="text/javascript">
        function SetName() {
            if (window.opener != null && !window.opener.closed) {
                var myElement = window.opener.document.querySelector(myId);
                myElement.style.left = document.getElementById("newPos").value + "px";
            }
            window.close();
        }
    </script>
</body>
</html>

Open in new window


As you can see I want to simply allow a user to change a <Div> style properties client side.  I have been trying all I can find for like 3 hours now, I am using FF 51, could the browser be blocking the passing of window name?
Avatar of Ryan Chong
Ryan Chong
Flag of Singapore image

have made several changes to your pages...

for your parent page, try:

<div id="superman" style="position:absolute;">
    <table border="0" cellpadding="0" cellspacing="0">
        <tr>
            <td>Name:&nbsp;
            </td>
                <a href="#" onclick="return SelectName('superman')">Adjust</a>
            </td>
        </tr>
    </table>
    </div>
    <script type="text/javascript">
        var popup;
        function SelectName(divId) {
            var myId = document.getElementById(divId).id;
            popup = window.open("Popup.htm", myId, "width=300,height=100");
            popup.name = myId;
            popup.focus();
            return false;
        }
    </script>

Open in new window


in your pop up page:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        var myId = window.name;
    </script>
</head>
<body>
    <br />
    <input type="text" id="newPos" />
    <br />
    <input type="button" value="Select" onclick="SetName();" />
    <script type="text/javascript">
        function SetName() {
            if (window.opener != null && !window.opener.closed) {
                var myElement = window.opener.document.querySelector("#"+myId);
                myElement.style.left = document.getElementById("newPos").value + "px";
            }
            window.close();
        }
    </script>
</body>
</html>

Open in new window


tested working fine in FF Quantum v 57 64-bit
Avatar of Mark Franz

ASKER

I ended up going a different route;
<script type="text/javascript">
        var popup;
        
        function SelectName(divId) {
            var divId;
            
            if (typeof (Storage) !== "undefined") { 
                // Store
                localStorage.setItem("theDiv", divId);
            }
            else {
                alert("Sorry! No Web Storage support..");
            }
            
            var popup = window.open("Popup.htm", "popup", "centerscreen=yes, width=300, height=100, top=200, left=500, toolbar=no, menubar=no, resizable=no, titlebar=no, close=no, location=no");
            
            popup.focus();
        }
    </script>

Open in new window

And;
<script type="text/javascript">
        function SetName() {
            var theDivA = localStorage.getItem("theDiv");
            var myID = "div#" + theDivA;
            var exprV = "V";
            ...

Open in new window

ok, seems that you're using localstorage to passing data. all modern web browsers should support it.

let me know if you have tested what I previously proposed and if you still find it useful.

then we can proceed to close this question.
Nope, didn't even try it since the local storage is perfect for my needs.
This question needs an answer!
Become an EE member today
7 DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform.
View membership options
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.