Keyboard Shortcuts

• Aug 01, 2019
• 3 minutes to read

A keyboard shortcut is a set of one or more keys that invoke a dialog or execute a command when triggered by an end-user. A shortcut is represented by the HtmlEditorShortcut class. A collection of shortcuts is stored in the HtmlEditorShortcutCollection object, which can be accessed by the ASPxHtmlEditor.Shortcuts property.

Default Shortcuts

By default, ASPxHtmlEditor provides the following shortcuts.

Shortcut	ActionName	ActionView	Description
Ctrl+A	selectall	Design	Selects the entire content
Ctrl+B	bold	Design	Applies bold formatting to the selected text
Ctrl+C	kbcopy	Design	Copies the selection
Ctrl+E	justifycenter	Design	Justifies text center
Ctrl+F	showsearchpanel	Design	Shows search panel
Ctrl+F	showsearchpanel	Html	Shows search panel
Ctrl+G	insertimagedialog	Design	Invokes the Insert Image Dialog
Ctrl+H	findandreplacedialog	Design	Invokes the Find and Replace Dialog
Ctrl+H	findandreplacedialog	Html	Invokes the Find and Replace Dialog
Ctrl+I	italic	Design	Applies italic formatting to the selected text
Ctrl+J	justifyfull	Design	Justifies text
Ctrl+K	insertlinkdialog	Design	Invokes the Insert Link Dialog for the selection
Ctrl+L	justifyleft	Design	Justifies text left
Ctrl+P	print	Design	Prints editor content
Ctrl+R	justifyright	Design	Justifies text right
Ctrl+U	underline	Design	Underlines the selected text
Ctrl+V	kbpaste	Design	Pastes content from the clipboard
Ctrl+X	kbcut	Design	Cuts the selection
Ctrl+Y	redo	Design	Redoes the last undone action
Ctrl+Z	undo	Design	Undoes the last action
Ctrl+Ins	kbcopy	Design	Copies the selection
Ctrl+Space	showintellisense	Html	Shows intellisense
Ctrl+Shift+K	unlink	Design	Unlinks the selection
Shift+Del	kbcut	Design	Cuts the selection
Shift+Ins	kbpaste	Design	Pastes content from the clipboard
F11	fullscreen	Design	Activates/deactivates the full-screen mode
F11	fullscreen	Html	Activates/deactivates the full-screen mode
F11	fullscreen	Preview	Activates/deactivates the full-screen mode

Shortcut Design-time Customization

ASPxHtmlEditor allows you to redefine default shortcuts and create custom shortcuts at design time in two ways.

• Using an ASPxHtmlEditor Designer

  

• Dectly in a markup

  The code sample below demonstrates how you can specify shortcuts in markup. The first shortcut invokes a MyDialog custom dialog. The second shortcut redefines a default Ctrl+B shortcut. The third shortcut assigns the default command bold to custom shortcut.

  Note that other default shortcuts (except Ctrl+B) are still in effect.

  ASPX

  <dx:ASPxHtmlEditor ID="MyHtmlEditor" runat="server">
       <CustomDialogs>
            <dx:HtmlEditorCustomDialog Caption="My Custom Dialog" 
            FormPath="~/CustomDialogs/MyCustomDialog1.ascx" Name="MyDialog" />
       </CustomDialogs>
       <Shortcuts>
            <dx:HtmlEditorShortcut ActionName="MyDialog" ActionType="ShowCustomDialog" Shortcut="Ctrl+D" />
            <dx:HtmlEditorShortcut ActionName="backcolor" Shortcut="Ctrl+B" />
            <dx:HtmlEditorShortcut ActionName="bold" Shortcut="Alt+B" />
       </Shortcuts>
  </dx:ASPxHtmlEditor>
  

Shortcut Runtime Customization

ASPxHtmlEditor allows you to modify a shortcut collection at run time, using the methods provided in the HtmlEditorShortcutCollection collection.

The code sample below demonstrates how you can modify a shortcut collection at run time. The first shortcut invokes a MyDialog custom dialog. The second shortcut redefines a default Ctrl+B shortcut. The third shortcut assigns the default command bold to a custom shortcut.

Note that other default shortcuts (except Ctrl+B) are still in effect.

ASPX

<dx:ASPxHtmlEditor ID="MyHtmlEditor" runat="server">
     <CustomDialogs>
          <dx:HtmlEditorCustomDialog Caption="My Custom Dialog" 
          FormPath="~/CustomDialogs/MyCustomDialog1.ascx" Name="MyDialog" />
     </CustomDialogs>
</dx:ASPxHtmlEditor>

C#

using DevExpress.Web.ASPxHtmlEditor;

...

protected void Page_Load(object sender, EventArgs e) {
     if (!IsPostBack) {
          MyHtmlEditor.Shortcuts.Add("Ctrl+D", "MyDialog", ActionType.ShowCustomDialog);
          MyHtmlEditor.Shortcuts.Add("Ctrl+B", "backcolor");
          MyHtmlEditor.Shortcuts.Add("Alt+B", "bold");
     }
}

VB.NET

Imports DevExpress.Web.ASPxHtmlEditor
...
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
    If Not IsPostBack Then
        MyHtmlEditor.Shortcuts.Add("Ctrl+D", "MyDialog", ActionType.ShowCustomDialog)
        MyHtmlEditor.Shortcuts.Add("Ctrl+B", "backcolor")
        MyHtmlEditor.Shortcuts.Add("Alt+B", "bold")
    End If
End Sub