Open a SPEAK dialog

Last updated Tuesday, August 30, 2016 in SPEAK for Content Author, Developer
Keywords: Development

A SPEAK dialog is a stand-alone SPEAK page that users open to perform a specific task. An example is the Select Media dialog. The user opens the dialog, performs the task, and closes the dialog again.

In a SPEAK application, users open the pages in the application from the menu or other navigational tools. Users typically open SPEAK dialogs from a button or a link. They can do this from a SPEAK page, but also from a page created in SheerUI.

This topic describes how to:

  • Open a SPEAK dialog from SheerUI
  • Replace an existing SheerUI dialog with a SPEAK dialog
  • Open a SPEAK dialog from SPEAK

Open a SPEAK dialog from SheerUI

You can open a SPEAK dialog from SheerUI with this function:

public static ClientCommand ShowModalDialog(ModalDialogOptions options)

To open a SPEAK page, you use this code:

SheerResponse.ShowModalDialog(new ModalDialogOptions(url)
{
  Width = "100",
  Height = "200",
  Response = true,
  ForceDialogSize = true
});

The relevant parameters are:

Option

Description

string url

Specifies the Sitecore path of the SPEAK page, for example, /sitecore/client/applications/dialogs/myPage

string Width

Sets the width of the SPEAK dialog, for example, 100

string Height

Sets the height of the SPEAK dialog, for example, 200

bool Response

If True, Sitecore returns the dialog result to the server when the dialog is closed

bool ForceDialogSize

Determines whether SPEAK uses the values of Width and Height. If True, SPEAK uses those values for the size of the dialog.

Replacing an existing dialog with a SPEAK dialog

To replace an existing SheerUI dialog with a SPEAK dialog, you just need to configure Sitecore to use the SPEAK dialog. This instructs Sitecore to use the SPEAK dialog rather than the old dialog everywhere – you do not have to modify the links or buttons that open the old dialog.

You configure the replacement this way:

  1. Open the Sitecore.Speak.Applications.config file in the Website\App_Config\Include folder.
  2. The <overrideXmlControls> and the <overrideDialogs> nodes contain lists of the old dialogs and the SPEAK page that replaces it, in this format:<override dialogUrl="<path to old dialog" with="path to SPEAK page" />For example:<override dialogUrl="/sitecore/shell/Applications/Item%20browser.aspx" with="/sitecore/client/applications/dialogs/InsertSitecoreItemViaTreeDialog" />Add the dialog you are replacing and the new page to this list.

Sitecore uses two processors in the HttpRequest pipeline for this: OverrideDialogs and OverrideXmlControl.

Sitecore uses this approach to replace a number of legacy dialogs. Sitecore uses XmlControls to create the legacy Select Media dialog and therefore uses the OverrideXmlControl processor – aspx dialogs use the OverrideDialogs processor.

Opening a SPEAK dialog from SPEAK

You create most dialogs natively in SPEAK using the DialogWindow component.

If you need to open a stand-alone page as a dialog within SPEAK, you can also use the DialogWindow component and then use a Frame component to show the actual dialog.

For example, to add JavaScript to the Click event of a Button control to open the DialogWindow dialog, you use this code:

javascript:app.DialogWindow1.show()

Send feedback about the documentation to docsite@sitecore.net.