Keyboard Support

RadWindow supports keyboard shortcuts to invoke its commands. This is an accessibility feature as well as functionality that can make working with the application more convenient for the end user.

Shortcuts can be global for the RadWindowManager - for commands that affect all its child RadWindows such as Tile, RestoreAll, CloseAll.

Commands that are specific for each separate RadWindow such as Close, Minimize, Maximize must be declared for each separate RadWindow. They are only active if the RadWindow has focus.

There are three ways to specify these shortcuts. The more common two are: in the <Shortcuts> inner tag:

Example 1: Set keyboard shortcuts in the markup.

<telerik:RadWindowManager RenderMode="Lightweight" ID="RadWindowManager1" runat="server">
    <Shortcuts>
        <telerik:WindowShortcut CommandName="RestoreAll" Shortcut="Alt+F3" />
        <telerik:WindowShortcut CommandName="Tile" Shortcut="Alt+F6" />
        <telerik:WindowShortcut CommandName="CloseAll" Shortcut="Esc" />
    </Shortcuts>
    <Windows>
        <telerik:RadWindow RenderMode="Lightweight" ID="RadWindow1" runat="server" VisibleOnPageLoad="true"
            NavigateUrl="https://www.telerik.com">
            <Shortcuts>
                <telerik:WindowShortcut CommandName="Maximize" Shortcut="Ctrl+F2" />
                <telerik:WindowShortcut CommandName="Restore" Shortcut="Ctrl+F3" />
            </Shortcuts>
        </telerik:RadWindow>
    </Windows>
</telerik:RadWindowManager>

or via the Shortcuts server-side property:

Example 2: Set keyboard shortcuts in the code-behind.

RadWindow1.Shortcuts.Add("Close", "Esc");
//or
RadWindow1.Shortcuts.Add(new Telerik.Web.UI.WindowShortcut("Close", "Esc"));

RadWindow1.Shortcuts.Add("Close", "Esc")
'or
RadWindow1.Shortcuts.Add(new Telerik.Web.UI.WindowShortcut("Close", "Esc"))

Since Q2 2012 the RadWindow also offers the option to modify the shortcuts via JavaScript by using the following methods:

Example 3: Set keyboard shortcuts via JavaScript.

var oWnd = $find("RadWindow1"); //get a reference to the desired RadWindow
oWnd.addShortcut("Command", "shortcutString"); //adds the specified shortcut string to the given command
oWnd.removeShortcut("Command"); //removes the last shortcut for the  given command
oWnd.getShortcutString("Command"); //returns the last shortcut for the given command
oWnd.isShortcutAdded("Command"); //returns true if a shortcut is added for this command
oWnd.removeAllShortcutsCommand("Command"); //clears all shortcuts for the given command

Shortcut modifications done via JavaScript will not be persisted if the control is disposed - either in an AJAX request, a full postback or via the DestroyOnClose functionality. These modifications are available only for a RadWindow instances and not for the RadWindowManager .

You should avoid globally used combinations such as Alt+F4, Ctrl+F5, etc. that have meaning in the context of the user browser/machine.

Here follows a list with the available commands:

for the RadWindowManager

Name	Executed command
CloseAll	Closes all opened RadWindows from the Windows Collection of the specific RadWindowManager
MinimizeAll	Minimizes all opened RadWindows from the Windows Collection of the specific RadWindowManager
RestoreAll	Restores all opened RadWindows from the Windows Collection of the specific RadWindowManager
MaximizeAll	Maximizes all opened RadWindows from the Windows Collection of the specific RadWindowManager
MinimizeActiveWindow	Minimizes the currently active (focused) RadWindow from the Windows Collection of the specific RadWindowManager
RestoreActiveWindow	Restores the currently active (focused) RadWindow from the Windows Collection of the specific RadWindowManager
CloseActiveWindow	Closes the currently active (focused) RadWindow from the Windows Collection of the specific RadWindowManager

For each separate RadWindow

Name	Executed command
Minimize	Minimizes the RadWindow
togglePin	Changes the Pinned property of the RadWindow to the opposite value (true/false)
Close	Closes the RadWindow
Maximize	Maximizes the RadWindow
Reload	Reloads the RadWindow

Handling Keyboard Shortcuts in the Content Page

To create a shortcut, RadWindow attaches a handler to the document where it is initialized (i.e., the page that opens it). In order for this handler to have effect over the RadWindow, the keyboard event must first bubble to the document. This cannot happen if the focus is in the content page of the RadWindow - the control should not modify the page to avoid breaking functionality created by the developer and pages from other domains will not allow this because of the same-origin policy browsers enforce.

To handle keyboard shortcuts in the content page, you must attach your own keyboard events and use the RadWindow's client-side API. Example 4 shows one way to close the RadWindow when the Esc key is pressed.

Example 4: Use keyboard shortcuts in the content page.

$(document).keydown(function (e) {
    if (e.keyCode == 27) { //the Esc key is pressed
        e.preventDefault(); //optionally, cancel the event
        GetRadWindow().close(); //close the RadWindow
    }
});

function GetRadWindow() {
    var oWindow = null;
    if (window.radWindow) oWindow = window.radWindow;
    else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow;
    return oWindow;
}

See Also

• See keyboard shortcuts in action online