class DocumentEditor
- Extends:
- UIComponent
Description:
DocumentEditor UI component that extends UIComponent class.
DocumentEditor is a text editor that can be switched to HTML mode to display or edit an HTML styled page. Only HTML 3.2 is supported. Modern tags like in HTML5 are not supported and may be ignored. HTML page can be styles with CSS but CSS support is also limited.
Editing the HTML page is not great, but may be enough for basic purposes. CSS can be added to the document separately by setCSS() and addCSS() methods, or it can be embedded into the HTML content using style tags.
For more methods for this component check UIComponent class.
Constructor
constructor([content])
DocumentEditor constructor. Check usage examples below
Parameters:
| Name | Type | Description |
|---|---|---|
|
|
string |
Initial content. |
Members
- [ readonly ] childCount
- [ readonly ] children
- [ readonly ] container
- [ readonly ] id
- [ readonly ] parent
- [ readonly ] screenPosition
Methods
From this class:
Inherited from UIComponent:
- addTo()
- anchor()
- background()
- border()
- bottom()
- caretPosition()
- center()
- color()
- contextMenu()
- copySelection()
- cursor()
- cutSelection()
- deleteSelection()
- destroy()
- dragAction()
- dragData()
- dragDataType()
- dropAction()
- dropDataType()
- dropMode()
- editable()
- emit()
- emitFocusKeyEvents()
- enabled()
- focusable()
- focused()
- font()
- getAncestor()
- getWindow()
- height()
- hide()
- index()
- isInside()
- layer()
- maxSize()
- minSize()
- move()
- onAncestorEvents()
- onCaretEvents()
- onChange()
- onComponentEvents()
- onDispose()
- onDragEvents()
- onDropEvents()
- onError()
- onFocusEvents()
- onKey()
- onMouseEvents()
- onMouseMotion()
- onMouseWheel()
- onPropertyChange()
- onScroll()
- opacity()
- paste()
- position()
- remove()
- right()
- scrollbars()
- scrollBarSize()
- scrollIncrement()
- scrollPosition()
- selectAll()
- selection()
- size()
- smoothScrolling()
- snapshot()
- text()
- tooltip()
- undoEnabled()
- undoLimit()
- updateUI()
- verifyComponent()
- visible()
- width()
- x()
- y()
Examples:
let content = "<html><body><h1>This is a header</h1><p>This is a new paragraph</p></body></html>";
const editor1 = new DocumentEditor(content).html(true); // creates editor and sets content in constructor
const editor2 = new DocumentEditor().html(true).text(content); // creates editor and then sets content