Get and set rich text editor content with JavaScript in ASP.NET Core

Your page may need to fill the editor from a template picker, read it before saving, or insert something at the caret. Every editor on the page can be reached from JavaScript.

Find the editor

Each one registers itself under its id or name:

<richtextbox id="Body" name="Body" toolbar="default"></richtextbox>

var editor = window.richTextBoxEditors.Body;

Note that document.getElementById("Body") is not the editor, and it may not find anything at all.

Common calls

Call	What it does
`editor.getHTMLCode()`	The document's HTML
`editor.setHTMLCode(html)`	Replaces the document
`editor.getPlainText()`	The text without markup
`editor.insertHTML(html)`	Inserts at the caret
`editor.execCommand("bold")`	Runs a command on the selection
`editor.focus()`	Puts the caret in the editor
`editor.setReadOnly(true)`	Stops or allows editing

Wait until it is ready

Run your code after the page has loaded, because the editor is created as the page starts:

window.addEventListener("load", function () {
    var editor = window.richTextBoxEditors.Body;
    editor.setHTMLCode("<p>Hello from JavaScript</p>");
});

Do not trust the browser

Everything here runs in the visitor's browser, so they could call it too. Use it for convenience, and enforce every rule on the server: clean the HTML, and check who may save.

The JavaScript API demo has buttons for these calls.