Modal and Modeless Dialog Boxes: Passing Objects back to the Caller - Doc JavaScript | WebReference

Modal and Modeless Dialog Boxes: Passing Objects back to the Caller - Doc JavaScript


Modal and Modeless Dialog Boxes

Passing Objects back to the Caller

Let's study the dialog box definition from the previous page's example. Here is the callee:

<HTML>
<HEAD>
<TITLE>callee.html</TITLE>
<SCRIPT>
function getInfoAndUpdate() {
  var callerWindowObj = dialogArguments;
  callerWindowObj.sColor = oEnterColor.value;
  callerWindowObj.update();
}
function cancel() {
  var callerWindowObj = dialogArguments;
  callerWindowObj.sColor = "Yellow";
  callerWindowObj.update();
}
</SCRIPT>
</HEAD>
<BODY>
Enter your favorite color:<INPUT ID=oEnterColor><BR><BR>
<INPUT VALUE="Apply" TYPE=button
  onclick="getInfoAndUpdate();">
<INPUT VALUE="Ok" TYPE=button
  onclick="getInfoAndUpdate();window.close();">
<INPUT VALUE="Cancel" TYPE=button
  onclick="cancel();window.close();">
</BODY>
</HTML>

We have one input field for the user's favorite color, oEnterColor, and three buttons: Apply, Ok, and Cancel. When either the Apply or the Ok buttons are clicked, the function getInfoAndUpdate() is called:

function getInfoAndUpdate() {
  var callerWindowObj = dialogArguments;
  callerWindowObj.sColor = oEnterColor.value;
  callerWindowObj.update();
}

We first assign dialogArguments to a local variable, callerWindowObj. Now we have the caller window object in callerWindowObj. We assign the caller's static variable, sColor, by setting it to the user's input:

 callerWindowObj.sColor = oEnterColor.value;

And then we call the caller's update function:

  callerWindowObj.update();

Notice that the function update() is defined in another file, caller.html. It's the window object that passes all caller's functions to the callee. To remind you, the update() function is defined as follows:

function update() {
  oColor.innerText = sColor;
}

When the Cancel button is clicked, a similar scenario is taking place, except that the value passed back is "Yellow" instead of the user's input:

function cancel() {
  var callerWindowObj = dialogArguments;
  callerWindowObj.sColor = "Yellow";
  callerWindowObj.update();
}

Next: A Final Word

https://www.internet.com


Produced by Yehuda Shiran and Tomer Shiran
All Rights Reserved. Legal Notices.
Created: August 13, 2001
Revised: August 13, 2001

URL: https://www.webreference.com/js/column90/9.html