How to send data from one .window to another using javascript?

Question

I have a form on main page, by pressing a specific button on it - new window() opens with a table in it, and by double clicking the line in the table it should transfer data from table into input fields of my form, but it doesn't. But if i run everything from one page it works fine.

So how should i modify my code so it can transfer data from new window

Main page:

<!DOCTYPE HTML>     
<html>    
<head>     
    <title>Untitled</title>     
    <meta charset="utf-8">     
</head>
<body>
    <button type="button" onclick="NewWindow()">Banks</button>
<br /><br />
    Bank Name:    
    <br />     
    <textarea id='bank' cols=56 rows=6></textarea>     
    Bank Adress:     
    <br />     
    <textarea id='bic' cols=56 rows=6></textarea>     
    <script>     
        var textarea_bank = document.getElementById('bank'),     
            textarea_bic = document.getElementById('bic');  
        function comm(obj) {     
            textarea_bank.value = obj.cells[0].innerHTML;     
            textarea_bic.value = obj.cells[1].innerHTML;     
        }            
        function NewWindow() 
            {
              myChildWin =  window.open("test.html", "_blank", "toolbar=no, scrollbars=no, resizable=no, top=100, left=100, width=600, height=600");
            }     
    </script>     
</body>  
</html>

Window with table(test.html):

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">     
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>test</title>        
    </head>
    <body>
        <table id="mySuperTBL">
        <tr>
            <td><b>BankName</b>
            </td>
            <td><b>BIC</b>
            </td>
        </tr>
        <tr id='1' ondblclick='comm(this)'>
            <td>Bank</td>
            <td>Adress</td>
        </tr>
    </table>        
    </body>
</html>

It should work like this jsbin.com/qeqetikiri/2 But the table must me on the popup window — Tachi
– Tachi, Commented Dec 18, 2014 at 12:04

Guy Dafny · Accepted Answer · 2014-12-18 12:19:37Z

2

Very simple, You should create two files. the second one is "stam.html" (this will be the child window):

Editing - bi-directional communication :-)

for the example the file will open itself (keep this file as "stam.html"). If this the parent, it will set the message to the child. else - it will set text to the parent.

<!DOCTYPE html>
<html>
    <head>
        <title>Bla!</title>
        <script type='text/javascript'>
            var m_ChildWindow = null; // 

            function OpenChildWIndow() {
                m_ChildWindow = window.open ("stam.html");
            }

            function SetDataToChild(data) {
                if (m_ChildWindow) {
                    m_ChildWindow.document.getElementById('body').innerHTML += "Dear son:" + data;
                } else {
                    opener.document.getElementById('body').innerHTML += "Dear Daddy:" + data;
                }
            }

            function Init() {
                var button = document.getElementById('cmdSendMsg');
                if (opener) {
                    button.innerHTML = "send message to daddy";
                }
            }
        </script>
    </head>
    <body id='body' onload = "Init();">
        <button onclick='OpenChildWIndow();'>Click to open child</button>
        <br>
        <button onclick='SetDataToChild("Hello <br>");' id='cmdSendMsg'>Click to add data to child</button>

    </body>
</html>

Here you have two buttons. the first will open the new window, the second one will add "hello" to it.

edited Dec 18, 2014 at 12:19

answered Dec 18, 2014 at 12:06

Guy Dafny

1,8491 gold badge15 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

Tachi Over a year ago

Thanks, but it kinda should work the opposite way :) Something like this: jsbin.com/qeqetikiri/2 but the table with data must be in a new popup window that i create using javascript, and should send data from that new window into my index.html

Tachi Over a year ago

Basically how your code can be modified so it can send data from child to parent?

Tachi Over a year ago

Hmm it still sends data to child with text: "Dear son:Hello". And nothing is being written in the main index.html

Guy Dafny Over a year ago

When you in the child, click the "send data to daddy". it will add to the parent the message " Dear Daddy:Hello " on the parent.

Tachi Over a year ago

There is no such button in the child window. Should i make it?

|

Ghyath Serhal · Accepted Answer · 2014-12-18 12:02:04Z

1

You should use query string, the below code shows how you can send an id of value 1 to the test.html

function NewWindow() 
{
    myChildWin =  window.open("test.html?id=1", "_blank", "toolbar=no, scrollbars=no, resizable=no, top=100, left=100, width=600, height=600");
}

answered Dec 18, 2014 at 12:02

Ghyath Serhal

7,6326 gold badges47 silver badges63 bronze badges

1 Comment

Tachi Over a year ago

I need to send the id of value not to the new window, but to the main page, i need to receive data from new window, not to send it to the main page

Collectives™ on Stack Overflow

How to send data from one .window to another using javascript?

2 Answers 2

7 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

7 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related