August 28, 2001 - Passing an Object to the Dialog Box | WebReference

August 28, 2001 - Passing an Object to the Dialog Box

Yehuda Shiran August 28, 2001
Passing an Array to the Dialog Box
Tips: August 2001

Yehuda Shiran, Ph.D.
Doc JavaScript

A powerful way to pass information between the caller and the callee in Internet Explorer is through an object. You can pass its properties from the caller to callee and back from the callee to the caller. You can also define the object's methods within the caller and use them within the callee. In fact, you can pass the caller window object to the callee. in this way, you ensure the callee has access to the caller's variables and functions.

Let's see an example. Our caller invokes the callee to prompt the user for his or her favorite color. The color is communicated back to the caller via the caller's update() function. First, play around with the scripts. Here is the caller:

<HTML>
<HEAD>
<TITLE>DialogArguments Example</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
var sColor="";              
function callDialog() {
 showModelessDialog("010828b.html",window,
   "status:false;dialogWidth:300px;dialogHeight:150px");
}
function update()
{
  oColor.innerText = sColor;
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<P>Enter your favorite color: <SPAN ID="oColor" 
STYLE="color:red;font-size:24">Yellow</SPAN></P> 
<INPUT TYPE="button" VALUE="Display Modeless Dialog" 
  onclick="callDialog()">
</BODY>
</HTML>

The favorite color field, oColor, is initialized to Yellow. When you click the Display Modeless Dialog button, the function callDialog() kicks in and calls showModelessDialog(). Notice the function call's second parameter: window. We pass the user's favorite color as the window object property.

For more on modal and modeless dialog boxes, go to Column 90, Modal and Modeless Dialog Boxes.