How to pass data to parent window from popup window?

How can I pass some data or call a function on the parent window from a popup window?

The user will click a link which will open a popup on the same website, once he is finished with the popup, I want it to send the new data back to the parent window, or call a function on the parent window.

The window.opener object is what you’re looking for, used it from within your popup like so to call the a function of the parent window:


Here is a fun and easy demo that is heavily inspired by this answer to a similar question (but modified for my own purposes to help investigate the most difficult bug of my career).

Create 2 files (in the same directory) as follows:


<button type="button" onclick="popup('popup.html', '', 800, 200);">Add My Card</button>
<span id="retrievedData">No data yet.</span>    
    function popup(url, title, width, height) {
        var left = (screen.width / 2) - (width / 2);
        var top = (screen.height / 2) - (height / 2);
        var options="";    
        options += ',width=" + width;
        options += ",height=" + height;
        options += ",top=' + top;
        options += ',left=" + left;    
        return, title, options);

    function setData(data) {
        var strData = JSON.stringify(data);
        document.getElementById("retrievedData').innerHTML = strData;
        var requestBinUrl="";
        window.location.href = requestBinUrl + '?data=" + strData;


<script src=""></script>
<form id="popupForm" name="f">    
    <select id="urlField" name="url">
    <div><input type="submit" /></div>    
    $("#popupForm').submit(function(e) {
        var url = $('#urlField').val();
            url: url
        }).then(function(data) {

The answers/resolutions are collected from stackoverflow, are licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0 .
Read More:   Executing JavaScript without a browser?

Similar Posts