API overview

Constructor

var richtext = new dhx.Richtext("richtext_container", {
	mode:"document"
});

Parameters:

• an HTML container (or the ID of an HTML container)
• an object with configuration properties (check below)

Methods

Name	Description
destructor	releases occupied resources
exitFullScreen	exits the full screen mode
fullScreen	enters the full screen mode
getEditorAPI	returns the full list of the editor API
getValue	gets the content entered into the RichText editor
getStats	returns statistics on the entered content
paint	repaints RichText
setValue	sets the provided content into the RichText editor

Event Bus methods

Name	Description
detach	detaches a handler from an event (which was attached before by the on() method)
fire	triggers an inner event
on	attaches a handler to an inner event of Vault

Events

Name	Description
Action	fires on any action in the editor
Change	fires on any change in the editor
selectionChange	fires on change of selection by a user
selectionRefresh	fires on automatic returning of cursor into the editor

Properties

Name	Description
customStats	defines the logic of displaying custom statistics
mode	the working mode of the RichText editor
toolbarBlocks	specifies blocks of buttons that will be shown in the Richtext toolbar

Editor API methods

var EditorAPI = richtext.getEditorAPI();

Name	Description
add	adds a new text into the editor
getModel	returns the data model of the entered text in the JSON format
getPosition	returns the position of text selection relative to the browser window
getSelection	returns the position of text selection relative to all other text
remove	removes a selected text
setModel	sets a structured text with styles (a data model as JSON) for the editor
setSelection	applies selection to the specified text position
update	modifies the entered text

Toolbar methods

Name	Description
add	adds a new control to the toolbar
remove	removes a control from the toolbar
update	updates configuration options of the control

Toolbar controls

Besides using the default controls of the toolbar, you can customize the toolbar by adding the following controls:

Name	Description
Button	a simple button that can have an icon
Custom HTML	an item that contains any custom HTML content (for example, an image, icon or other element)
ImageButton	a button with an image
SelectButton	a button that contains a drop-down list of options
Separator	a horizontal (between menu options) or vertical (between toolbar controls) line separating items/groups of items from each other
Spacer	the item takes space on the toolbar and is used for aligning controls