Set a callback function to a new window in javascript

68,302

Updated for comments: If you're opening your window via window.open() then in your child page you can set a function in the child to just be a reference pointing to a parent function, so have this in the child page:

var RunCallbackFunction = function() { }; //reference holder only

Then in your parent (opener), set that function when that child window loads, like this:

//random function you want to call
function myFunc() { alert("I'm a function in the parent window"); }

//to actually open the window..
var win = window.open("window.html");
win.onload = function() { win.RunCallbackFunction = myFunc; };

This assigns the function in your parent to now be the target of that child...and you can point each child to a different function if you wish, they're all independent.

Share:
68,302
SztupY
Author by

SztupY

I am a polyglot developer who likes challenges and is never afraid of diving into deep territories to get a better understanding of the big picture. I am always keen to learn more every time, and I am always happy to pass on my knowledge to anyone who wants to learn more. I am originally from Hungary, been in NRW, Germany, and now living in Edinburgh, Scotland. I can speak Hungarian, English, German, and a bit of French and Swedish

Updated on December 24, 2020

Comments

  • SztupY
    SztupY over 3 years

    Is there an easy way to set a "callback" function to a new window that is opened in javascript? I'd like to run a function of the parent from the new window, but I want the parent to be able to set the name of this particular function (so it shouldn't be hardcoded in the new windows page).

    For example in the parent I have:

    function DoSomething { alert('Something'); }
    ...
    <input type="button" onClick="OpenNewWindow(linktonewwindow,DoSomething);" />
    

    And in the child window I want to:

    <input type="button" onClick="RunCallbackFunction();" />
    

    The question is how to create this OpenNewWindow and RunCallbackFunction functions. I though about sending the function's name as a query parameter to the new window (where the server side script generates the appropriate function calls in the generated child's HTML), which works, but I was thinking whether there is another, or better way to accomplish this, maybe something that doesn't even require server side tinkering.

    Pure javascript, server side solutions and jQuery (or other frameworks) are all welcomed.