Keyboard support in ASP.NET MVC Markdown Editor Control

17 Mar 20257 minutes to read

You can use the following keyboard shortcuts when the Rich Text Editor is set to EditorMode as Markdown.

These shortcuts provide quick access to toolbar functions for managing menus and dialogs.

Actions	Windows	Mac
Focus on toolbar	`Alt` + `F10`	`⌥` + `F10`
Close dropdowns/menu and dialogs	`Esc`	`Esc`

Content editing and formatting

These shortcuts help in efficiently editing and formatting text content.

Actions	Windows	Mac
Select all content	`Ctrl` + `A`	`⌘` + `A`
Insert a hard line break (a new paragraph)	`Enter`	`Enter`
Make text bold	`Ctrl` + `B`	`⌘` + `B`
Italicize text	`Ctrl` + `I`	`⌘` + `I`
Apply strikethrough	`Ctrl` + `Shift` + `S`	`⌘` + `⇧` + `S`

Inserting

These shortcuts allow for the quick insertion of tables, links, and images.

Actions	Windows	Mac
Open the insert table dialog	`Ctrl` + `Shift` + `E`	`⌘` + `⇧` + `E`
Create link	`Ctrl` + `K`	`⌘` + `K`
Open the insert image dialog	`Ctrl` + `Shift` + `I`	`⌘` + `⇧` + `I`

Text manipulation

These shortcuts help in modifying text case and applying superscript or subscript.

Actions	Windows	Mac
Convert text to uppercase	`Ctrl` + `Shift` + `U`	`⌘` + `⇧` + `U`
Convert text to lowercase	`Ctrl` + `Shift` + `L`	`⌘` + `⇧` + `L`
Apply superscript	`Ctrl` + `Shift` + `=`	`⌘` + `⇧` + `=`
Apply subscript	`Ctrl` + `=`	`⌘` + `=`

Lists

These shortcuts enable the creation of ordered and unordered lists.

Actions	Windows	Mac
Create an ordered list	`Ctrl` + `Shift` + `O`	`⌘` + `⇧` + `O`
Create an unordered list	`Ctrl` + `Alt` + `O`	`⌘` + `⌥` + `O`

Clipboard operations

These shortcuts facilitate copying, cutting, and pasting content.

Actions	Windows	Mac
Copy the selected content	`Ctrl` + `C`	`⌘` + `C`
Cut the selected content	`Ctrl` + `X`	`⌘` + `X`
Paste the copied or cut content	`Ctrl` + `V`	`⌘` + `V`

Undo & redo

These shortcuts allow for undoing and redoing recent changes.

Actions	Windows	Mac
Undo	`Ctrl` + `Z`	`⌘` + `Z`
Redo	`Ctrl` + `Y`	`⌘` + `Y`

Other actions

These shortcuts provide additional functionalities like fullscreen mode.

Actions	Windows	Mac
Toggle fullscreen mode	`Ctrl` + `Shift` + `F`	`⌘` + `⇧` + `F`

CSHTML
Controller.cs
@using Syncfusion.EJ2.RichTextEditor

@Html.EJS().RichTextEditor("keyboard").EditorMode(EditorMode.Markdown).Value((string)ViewBag.value).Created("created").Height(300).ToolbarSettings(e => e.Items((object)ViewBag.items)).Render()

<script type="text/javascript">
    var rteObj;
    function created() {
        rteObj = this;
    }
    document.addEventListener('keyup', function (e) {
        if (e.altKey && e.keyCode === 84) { /* t */
            // press alt+t to focus the control.
            rteObj.focusIn();
        }
    });
</script>
public class HomeController : Controller
{

    public ActionResult Index()
    {
        ViewBag.items = new[] { "Bold", "Italic", "StrikeThrough", "|",
        "Formats", "OrderedList", "UnorderedList", "|",
        "CreateLink", "Image", "CreateTable", "|","Undo", "Redo" };

        ViewBag.value = @"The sample is added to showcase **markdown editing**.

    Type or edit the content and apply formatting to view markdown formatted content.

    We can add our own custom formation syntax for the Markdown formation.

    The third-party library <b>Marked</b> is used in this sample to convert markdown into HTML content";

        return View();
    }
}