Using SPEAK

Open a SPEAK dialog

Version:

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:

Open the Sitecore.Speak.Applications.config file in the Website\App_Config\Include folder.
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()

If you have suggestions for improving this article, let us know!