Working with RichText

The API of dhtmlxRichText includes a basic set of methods that let you perform operations on the component. You can serialize edited text into either HTML or Markdown formats, get the number of the typed characters and enter/exit the full screen mode of the editor on the fly.

Getting content from editor

After you've entered the necessary text into the editor and formatted it to your taste, you can save the result in the either of the two supported formats.

To save the edited text, make use of the getValue method. The method takes an only parameter:

  • mode - (string) the format the text should be saved in: "html" or "mode". "html" is used by default
// getting content in the markdown format
var content = richtext.getValue("markdown");

Related sample:  Getting content

Getting number of characters

You can easily return the count of characters typed into the editor via the chars property of the getStats method.

var chars = richtext.getStats().chars;

Using the method you can display info on the number of entered characters in any part of your application. For example, in a separate container by a click on a button:

<button onclick="calc()" class="dhx_btn dhx_btn--flat">Characters Count</button>
 
<div>
    The count of characters: <span id="characters-amount"></span>
</div>
 
function calc() {
   document.getElementById('characters-amount').innerText = richtext.getStats().chars;
}

Related sample:  Getting statistics

Full screen mode

You can enter/exit the full screen mode for the Rich text editor with the help of the corresponding API methods: fullScreen and exitFullScreen:

// enter full screen
richtext.fullScreen();
 
// exit full screen
richtext.exitFullScreen();
Back to top