Windows apps
Collapse the table of content
Expand the table of content
The topic you requested is included in another documentation set. For convenience, it's displayed below. Choose Switch to see the topic in its original location.

showModelessDialog method

Creates a modeless dialog box that displays the specified HTML document.


var retval = window.showModelessDialog(url, varArgIn, options);


url [in]

Type: String

String that specifies the URL of the document to load and display.

varArgIn [in, optional]

Type: Variant

Variant that specifies the arguments to use when displaying the document. Use this parameter to pass a value of any type, including an array of values. The dialog box can extract the values passed by the caller from the dialogArguments property of the window object.

options [in, optional]

Type: Variant

Variant of type String that specifies the window ornaments for the dialog box, using one or more of the following semicolon-delimited values:


Sets the height of the dialog window (see Remarks for default unit of measure).


Sets the left position of the dialog window relative to the upper-left corner of the desktop.


Sets the top position of the dialog window relative to the upper-left corner of the desktop.


Sets the width of the dialog window (see Remarks for default unit of measure).

center:{ yes | no | 1 | 0 | on | off }

Specifies whether to center the dialog window within the desktop. The default is yes.

dialogHide:{ yes | no | 1 | 0 | on | off }

Specifies whether the dialog window is hidden when printing or using print preview. This feature is only available when a dialog box is opened from a trusted application. The default is no.

edge:{ sunken | raised }

Specifies the edge style of the dialog window. The default is raised.

help:{ yes | no | 1 | 0 | on | off }

Internet Explorer 7 and later. This parameter value is no longer supported. In earlier versions, this value indicates whether or not the dialog window displays the context-sensitive Help icon. The default value is yes.

resizable:{ yes | no | 1 | 0 | on | off }

Specifies whether the dialog window has fixed dimensions. The default is no.

scroll:{ yes | no | 1 | 0 | on | off }

Specifies whether the dialog window displays scrollbars. The default is yes.

status:{ yes | no | 1 | 0 | on | off }

Specifies whether the dialog window displays a status bar. The default is yes for untrusted dialog windows and no for trusted dialog windows.

unadorned:{ yes | no | 1 | 0 | on | off }

Specifies whether the dialog window displays the border window chrome. This feature is only available when a dialog box is opened from a trusted application. The default is no.

Return value

Type: IHTMLWindow2

A Variant that returns a reference to the new window object. Use this reference to script properties and methods on the new window.

Standards information

There are no standards that apply here.


The modeless dialog box displays even when the user switches input focus to the window.

The showModelessDialog method is useful for menus and Help systems. When you invoke this method, a dialog box appears, layered in front of the browser window or HTML Application (HTA).

Because a modeless dialog box can include a URL to a resource in a different domain, do not pass information through the varArgIn parameter that the user might consider private. The varArgIn parameter can be referenced within the modeless dialog box using the dialogArguments property of the window object. If the varArgIn parameter is defined as a string, the maximum string length that can be passed to the modeless dialog box is 4096 characters; longer strings are truncated.

By convention, modeless dialog boxes can differ from an application window in that they do not have scroll bar, status bar, or resize capabilities. To create this type of dialog box, implement the following steps:

  • Turn off the scroll bar. Use the scroll attribute by including the scroll="no" value in the body tag for the dialog window.
  • Turn off the status bar. Set the value of status to no in the options parameter of the showModelessDialog call. A second option is to call the dialog window from a trusted application, such as Microsoft Visual Basic or an HTA, or from a trusted window, such as a trusted dialog box. These are considered trusted because they use Windows Internet Explorer interfaces instead of the browser. The status bar of any dialog box generated from a trusted source is set to off by default.
  • Do not allow resizing. Resizing is set to off by default.

To create a return value for showModelessDialog, set the varArgIn parameter to a callback function or an object in the showModelessDialog call. In the modeless dialog box, you can reference this function or object through the dialogArguments property of the window object. The same arguments are valid for the showModelessDialog and showModalDialog methods.

You can set the default font settings the same way you set Cascading Style Sheets (CSS) attributes (for example, "font:3; font-size:4"). To define multiple font values, use multiple font attributes.

To override center, even though the default for center is yes, you can specify either dialogLeft and/or dialogTop.

This method must use a user-initiated action, such as clicking a link or tabbing to a link and pressing ENTER, to open a pop-up window.

When Windows Internet Explorer opens a window from a modal or modeless HTML dialog box by using the showModalDialog method or by using the showModelessDialog method, Internet Explorer uses Component Object Model (COM) to create a new instance of the window. Typically, the window is opened by using the first instance of an existing Internet Explorer process. When Internet Explorer opens the window in a new process, all the memory cookies are no longer available, including the session ID. This process is different from the process that Internet Explorer uses to open a new window by using the open method.

For Internet Explorer 7, dialogHeight and dialogWidth return the height and width of the content area and no longer includes the height and width of the frame.

Internet Explorer 7. Although a user can manually adjust the height of a dialog box to a smaller value —provided the dialog box is resizable— the minimum dialogHeight you can specify is 100 pixels, and the minimum dialogWidth you can define is 250 pixels. In versions earlier than Internet Explorer 7 the minimum value of the dialogWidth that can be specified is 100 pixels.

The Pop-up Blocker feature in Microsoft Internet Explorer 6 blocks windows that are opened without being initiated by the user.


This example uses the showModelessDialog method to create a return value. It also shows how to handle user actions in the modeless dialog box. Two sample documents are displayed below. The first one (showModelessDialogEX.htm) uses the showModelessDialog method to access the DHTML code found in the second sample document called myDialog.htm. This creates a modeless dialog box that prompts the user for a name, which can then be displayed in the parent window.

<script type="text/javascript">
var sUserName="";              
Supplying the window object as a parameter allows for declaring the global 
variable, sUserName, and using it to return information from the modeless 
dialog box.
------------------------------------------------------------- */
function fnCallDialog()                                             
The fnUpdate function takes the value passed into sUserName in myDialog.htm 
to update the span text on this page. This function is called in both 
fnGetInfo and fnCancel functions in myDialog.htm.
function fnUpdate()
  oName.innerText = sUserName;
<p>Enter your first name: <span id="oName" 
style="color:red;font-size:24">Joan</span></p> <input type="button" 
value="Display Modeless Dialog" onclick="fnCallDialog()">

Here is the code for "myDialog.htm".

Code example:

<script type="text/javascript">
/* -------------------------------------------------------------
This function makes use of the dialogArguments property of the
window object. dialogArguments allows the global variable sUserName
to feed the value supplied to the input in this dialog box back to
the window that called it.
---------------------------------------------------------------- */
function fnGetInfo()
  var sData = dialogArguments;
  sData.sUserName = oEnterName.value;
/* -------------------------------------------------------------
This function cleans up in case the user has clicked the 
Apply button before canceling.
---------------------------------------------------------------- */
function fnCancel()
  var sData = dialogArguments;
  sData.sUserName = "Joan";
<label for="oEnterName" accesskey="f">Enter your 
<span style="text-decoration:underline">F</span>irst Name</label>
<input id=oEnterName><br><br>
<input value="Apply" type=button onclick="fnGetInfo();">
<input value="Ok" type=button onclick="fnGetInfo();window.close();">
<input value="Cancel" type=button onclick="fnCancel();window.close();">

The following example demonstrates many of the features available for creating a custom modeless dialog box.

Code example:

Neither modal or modeless HTML dialog boxes support text selection or the standard shortcut menu for copy operations; however, you can imitate this functionality by using script with TextRange objects and event handlers for onmousedown and onmousemove, as in the following example.

Code example:

See also

About the Pop-up Blocker



© 2017 Microsoft