This article describes the API migration process of Rich Text Editor control from Essential JS 1 to Essential JS 2.
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Keyboard Navigation | Property: allow-keyboard-navigation <ej-rte allow-keyboard-navigation="true"></ej-rte> |
No separate Property for enable/disable keyboard navigation. Its enabled by default. |
Localization | Property: locale <ej-rte locale="en-US"></ej-rte> |
Property: locale <ejs-richtexteditor locale="en-US"></ejs-richtexteditor> |
RTL | Property: enable-rtl<ej-rte enable-rtl="true "></ej-rte> |
Property: enableRtl <ejs- Rich Text Editor enableRtl="true" ></ejs- richtexteditor> |
Key Config | Not Applicable | Property: keyConfig<ejs-richtexteditor keyConfig="@ViewBag.keyConfig"></ejs-richtexteditor> |
Tab Key Navigation | Property: enable-tab-Key-navigation <ej-rte enable-tab-Key-navigation ="true"></ej-rte> |
Property: enableTabKey<ejs-richtexteditor enableTabKey = "true"></ejs-richtexteditor> |
Key Down | Event: key-down<ej-rte key-down="onKeydown"></ej-rte> |
Not Applicable |
Key Up | Event: key-up<ej-rte key-up="onKeyup"></ej-rte> |
Not Applicable |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
showToolbar | Property: show-toolbar<ej-rte show-toolbar="true"></ej-rte> |
Property: enable <ejs-richtexteditor id="defaultRTE"><e-richtexteditor-toolbarsettings enable = "true"></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Tools item | Property: tools List<String> lists = new List<string>() { "unorderedList", "orderedList" }; <ej-rte id="rteSample"><e-tools lists="lists"></e-tools></ej-rte> |
Property: items<ejs-richtexteditor><e-richtexteditor-toolbarsettings items="@ViewBag.items"></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Tools-list | Property: tools-list@{ List<String> toolsList = new List<string>() { "style", "lists", "doAction", "links", "images" }; <ej-rte tools-list="toolsList"></ej-rte> |
Property: items<ejs-richtexteditor><e-richtexteditor-toolbarsettings items="@ViewBag.items"></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Toolbar Overflow Mode | Property: toolbar-overflow-mode <ej-rte toolbar-overflow-mode="popup"></ej-rte> |
Property: type 1.Expand 2.MultiRow <ejs-richtexteditor><e-richtexteditor-toolbarsettings type="Expand"></e-richtexteditor-toolbarsettings></ejs-richtexteditor><ejs-richtexteditor><e-richtexteditor-toolbarsettings type="MultiRow"></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Floating Toolbar | Not Applicable | Property: enableFloating <ejs-richtexteditor><e-richtexteditor-toolbarsettings enableFloating = "true"></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Floating Toolbar Offset | Not Applicable | Property: floatingToolbarOffset <ejs-richtexteditor floatingToolbarOffset = "50"><e-richtexteditor-toolbarsettings enableFloating = "true"></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Inline toolbar | Not Applicable | Property: inlineMode<ejs-richtexteditor ><e-richtexteditor-toolbarsettings items = "@ViewBag.items" ><e-richtexteditor-inlinemode enable="true" onSelection="true"></e-richtexteditor-inlinemode></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Quick Toolbar | Not Applicable | Property: quicktoolbarsettings1.image 2.link 3.table 4.clipboard <ejs-richtexteditor><e-richtexteditor-toolbarsettings items = "@ViewBag.items" ></e-richtexteditor-toolbarsettings><e-richtexteditor-quicktoolbarsettings image="@ViewBag.image"></e-richtexteditor-quicktoolbarsettings></ejs-richtexteditor> |
Enable Toolbar Item | Method: enableToolbarItem()var rteObj = $("#rte ").data("ejRTE "); rteObj.enableToolbarItem() |
Method: enableToolbarItem() var rteObj = document.getElementById('richtexteditor').ej2_Instances[0]; rteObj.enableToolbarItem(); |
Disable Toolbar Item | Method: disableToolbarItem() var rteObj = $("#rte ").data("ejRTE "); rteObj.disableToolbarItem() |
Method: disableToolbarItem() var rteObj = document.getElementById('richtexteditor').ej2_Instances[0]; rteObj.disableToolbarItem(); |
Remove Toolbar Item | Method: removeToolbarItem() var rteObj = $("#rte ").data("ejRTE "); rteObj.removeToolbarItem() |
Method: removeToolbarItem() var rteObj = document.getElementById('richtexteditor').ej2_Instances[0]; rteObj.removeToolbarItem() |
Toolbar Click | Not Applicable | Event: toolbar-click <ejs-richtexteditor toolbarClick= "onToolbarClick"></ejs-richtexteditor> |
Show Full Screen | Not Applicable | Method: showFullScreen()var rteObj = document.getElementById('richtexteditor').ej2_Instances[0]; rteObj. showFullScreen() |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Format | Property: format <ej-rte format="viewBag.format"></ej-rte> |
Property: format <ejs-richtexteditor><e-richtexteditor-format default="pPragraph" width="70px" types="items"></e-richtexteditor-format><e-richtexteditor-toolbarsettings items = "@ViewBag.items"><e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Font Size | Property: font-size <ej-rte font-size="viewBag.fontSize"></ej-rte> |
Property: fontSize<ejs-richtexteditor><e-richtexteditor-fontsize width="40px" default="10", types="items"></e-richtexteditor-fontsize><e-richtexteditor-toolbarsettings items = "@ViewBag.items" ></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Font Family | Property: font-name<ej-rte font-name="viewBag.fontName"></ej-rte> |
Property: fontFamily<ejs-richtexteditor><e-richtexteditor-fontfamily width="100px" default="0" types="items"></e-richtexteditor-fontfamily><e-richtexteditor-toolbarsettings items = "@ViewBag.items" ></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Show Font Option | Property: show-font-option<ej-rte show-font-option = "true"></ej-rte> |
Property: fontFamily<ejs-richtexteditor><e-richtexteditor-fontfamily width="70px" default="0", types="items"></e-richtexteditor-fontfamily><e-richtexteditor-toolbarsettings items = "@ViewBag.items" ></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Font Color | Property: color-code <ej-rte color-code="viewBag.colorCode"></ej-rte> |
Property: fontColor<ejs-richtexteditor><e-richtexteditor-fontcolor modeSwitcher="true" default="#fff"></e-richtexteditor-fontcolor><e-richtexteditor-toolbarsettings items="viewBag.item"></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Background Color | Not Applicable | Property: BackgroundColor<ejs-richtexteditor><e-richtexteditor-backgroundcolor modeSwitcher="true" default= "#fff" mode= "Palette" columns="10" ></e-richtexteditor-backgroundcolor><e-richtexteditor-toolbarsettings items="viewBag.item"></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Color Palette Columns | Property: color-code <ej-rte color-palette-columns="10"></ej-rte> |
Property: BackgroundColor<ejs-richtexteditor><e-richtexteditor-backgroundcolor columns="10" ></e-richtexteditor-backgroundcolor><e-richtexteditor-toolbarsettings items="viewBag.item"></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Color Palette Rows | Property: color-palette-rows <ej-rte color-palette-rows="6"></ej-rte> |
Not Applicable |
Color Picker Type | Method: setColorPickerType () var rteObj = $("#rte ").data("ejRTE "); rteObj.setColorPickerType("picker") |
Property: Mode <ejs-richtexteditor ><e-richtexteditor-backgroundcolor mode="Palette" ></e-richtexteditor-backgroundcolor><e-richtexteditor-toolbarsettings items="viewBag.item"></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Link | Not Applicable | Property: CreateLinkviewBag.item = new[] {"CreateLink"} <ejs-richtexteditor><e-richtexteditor-toolbarsettings items="viewBag.item"></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Quick Toolbar | Not Applicable | Property: linkviewBag.link = new [] {Open, Edit, UnLink} <ejs-richtexteditor><e-richtexteditor-toolbarsettings items = "@ViewBag.items"></e-richtexteditor-toolbarsettings><e-richtexteditor-quicktoolbarsettings link="@ViewBag.link"></e-richtexteditor-quicktoolbarsettings></ejs-richtexteditor> |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Image | Not Applicable | Property: Image viewBag.item = new[] {"Image"} <ejs-richtexteditor><e-richtexteditor-toolbarsettings tems="viewBag.item"></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Quick Toolbar | Not Applicable | Property: image viewBag.link = new [] {"Replace", "Align", "Caption", "Remove", "-", "InsertLink","OpenImageLink", "EditImageLink", "RemoveImageLink", "Display", "AltText", "Dimension"} <ejs-richtexteditor><e-richtexteditor-toolbarsettings items = "@ViewBag.items"></e-richtexteditor-toolbarsettings><e-richtexteditor-quicktoolbarsettings image="@ViewBag.image"></e-richtexteditor-quicktoolbarsettings></ejs-richtexteditor> |
Image Setting | Property: ImagesList<String> images = new List<string>() { "image" }; <ej-rte><e-tools images="images"></e-tools></ej-rte> |
Property: insrtImageSettings <ejs-richtexteditor><e-richtexteditor-insertimagesettings display="inline"></e-richtexteditor-insertimagesettings><e-richtexteditor-toolbarsettings items = "@ViewBag.items"></e-richtexteditor-toolbarsettings><e-richtexteditor-quicktoolbarsettings image="@ViewBag.image"></e-richtexteditor-quicktoolbarsettings></ejs-richtexteditor> |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Table | Not Applicable | Property: CreateTableviewBag.item = new[] {"CreateTable"} <ejs-richtexteditor><e-richtexteditor-toolbarsettings items="viewBag.item"></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Quick Toolbar | Not Applicable | Property: tableviewBag.table = new [] {"TableHeader", "TableRows", "TableColumns", "BackgroundColor", "-", "TableRemove", "Alignments", "TableCellVerticalAlign", "Styles" } <ejs-richtexteditor><e-richtexteditor-toolbarsettings items = "@ViewBag.items"></e-richtexteditor-toolbarsettings><e-richtexteditor-quicktoolbarsettings table="@ViewBag.table"></e-richtexteditor-quicktoolbarsettings></ejs-richtexteditor> |
Table Setting | Property: table-columns, table-rows<ej-rte table-columns="10"></ej-rte> <ej-rte table-rows = "10"></ej-rte> |
Property: tableSettings<ejs-richtexteditor><e-richtexteditor-tableSettings width="80%"></e-richtexteditor-tableSettings><e-richtexteditor-toolbarsettings items = "@ViewBag.items"></e-richtexteditor-toolbarsettings><e-richtexteditor-quicktoolbarsettings table="@ViewBag.table"></e-richtexteditor-quicktoolbarsettings></ejs-richtexteditor> |
Custom table | Property: show-custom-table<ej-rte show-custom-table="true"></ej-rte> |
Not Applicable |
Insert Column | Method: insertColumn([before],[cell])var rteObj = $("#rte ").data("ejRTE "); rteObj.insertColumn(true, "<td></td>") |
Property: TableColumns viewBag.table = new [] {"TableColumns"} <ejs-richtexteditor><e-richtexteditor-toolbarsettings items = "@ViewBag.items"></e-richtexteditor-toolbarsettings><e-richtexteditor-quicktoolbarsettings table ="@ViewBag.table "></e-richtexteditor-quicktoolbarsettings></ejs-richtexteditor> |
Insert Row | Method: insertRow([before],[cell]) var rteObj = $("#rte ").data("ejRTE "); rteObj.insertRow(true, "<tr></tr>") |
Property: TableRows viewBag.table = new [] {"TableRows"} <ejs-richtexteditor><e-richtexteditor-toolbarsettings items = "@ViewBag.items"></e-richtexteditor-toolbarsettings><e-richtexteditor-quicktoolbarsettings table ="@ViewBag.table"></e-richtexteditor-quicktoolbarsettings></ejs-richtexteditor> |
Remove Table | Method: removeTable([table])var rteObj = $("#rte").data("ejRTE "); rteObj.removeTable("table") |
Property: TableRemove viewBag.table = new [] {"TableRemove"} <ejs-richtexteditor><e-richtexteditor-toolbarsettings items = "@ViewBag.items"></e-richtexteditor-toolbarsettings><e-richtexteditor-quicktoolbarsettings table ="@ViewBag.table "></e-richtexteditor-quicktoolbarsettings></ejs-richtexteditor> |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Character Count | Property: show-char-count<ej-rte show-char-count="true"></ej-rte> |
Property: showCharCount<ejs-richtexteditor showCharCount = "true"><e-richtexteditor-toolbarsettings items="viewBag.item"></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Word Count | Property: show-word-count<ej-rte show-word-count="true"></ej-rte> |
Not Applicable |
Maximum Length | Property: max-length <ej-rte max-length ="1000"></ej-rte> |
Property: maxLength<ejs-richtexteditor maxLength = "1000"></ejs-richtexteditor> |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Enable Iframe | By Default, enabled | Property: iframeSettings<ejs-richtexteditor id="iframe" value="@ViewBag.value"><e-richtexteditor-iframesettings enable="true"></e-richtexteditor-iframesettings></ejs-richtexteditor> |
Attributes | Property: iframe-attributes<ej-rte iframe-attributes="viewBag.attribute"></ej-rte> |
Property: attributes <ejs-richtexteditor id="iframe" value="@ViewBag.value"><e-richtexteditor-iframesettings enable="true"></e-richtexteditor-iframesettings></ejs-richtexteditor> <script>var iframeRTE; function created() { iframeRTE = this; this.setProperties({ iframeSettings: { enable: true, attributes: { readonly: "readonly"} } }, false); } </script> |
Resource | Property: external-CSS<ej-rte external-CSS ="defult.css"></ej-rte> |
Property: attributes<ejs-richtexteditor id="iframe" value="@ViewBag.value"><e-richtexteditor-iframesettings enable="true"></e-richtexteditor-iframesettings></ejs-richtexteditor> <script> var iframeRTE; function created() { iframeRTE = this; this.setProperties({ iframeSettings: { enable: true, resources: { styles: ["myStyle.css"]}}}, false);} </script> |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Editor Mode | Not Applicable | Property: editorMode 1.HTML 2.Markdown <ejs-richtexteditor editorMode = "HTML"></ejs-richtexteditor> |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Undo Stack Limit | Property: undo-stack-limit <ej-rte undo-stack-limit ="50"></ej-rte> |
Property: undoRedoSteps <ejs-richtexteditor undoRedoSteps = "30"></ejs-richtexteditor> |
Undo Redo Timer | Not Applicable | Property: undoRedoTimer<ejs-richtexteditor undoRedoTimer = "300"></ejs-richtexteditor> |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Allow Editing | Property: allow-editing <ej-rte allow-editing="true"></ej-rte> |
Property: readonly<ejs-richtexteditor readonly = "true"></ejs-richtexteditor> |
Auto Focus | Property: auto-focus <ej-rte auto-focus="false"></ej-rte> |
Not Applicable |
Auto Height | Property: auto-height <ej-rte auto-height="true"></ej-rte> |
Not Applicable |
Paste Clean Up | Property: paste-cleanup-settings <ej-rte><e-paste-cleanup-settings clean-css="true" list-conversion="true" remove-styles="true" clean-elements="true" /></ej-rte> |
Not Applicable |
Css Class | Property: css-class <ej-rte css-class="customStyle"></ej-rte> |
Property: cssClass <ejs-richtexteditor cssClass = "customStyle"></ejs-richtexteditor> |
Enabled | Property: enabled <ej-rte enabled="true"></ej-rte> |
Property: enabled<ejs-richtexteditor enabled = "true"></ejs-richtexteditor> |
Html Encode | Property: enable-html-encode <ej-rte enable-html-encode="true"></ej-rte> |
Property: enableHtmlEncode<ejs-richtexteditor enableHtmlEncode = "true"></ejs-richtexteditor> |
Persistence | Property: enable-persistence <ej-rte enable-persistence ="true"></ej-rte> |
Property: enablePersistence<ejs-richtexteditor enablePersistence = "true"></ejs-richtexteditor> |
Resize | Property: enable-resize <ej-rte enable-resize ="true"></ej-rte> |
Not Applicable |
XHTML | Property: enable-XHTML <ej-rte enable-XHTML ="true"></ej-rte> |
Not Applicable |
Height | Property: height <ej-rte height="350px"></ej-rte> |
Property: height<ejs-richtexteditor height = "350px"></ejs-richtexteditor> |
Width | Property: width <ej-rte width="500px"></ej-rte> |
Property: width <ejs-richtexteditor width = "500px"></ejs-richtexteditor> |
Html Attributes | Property: html-attributes <ej-rte html-attributes="viewBag.htmlAttr"></ej-rte> |
Property: htmlAttributes<ejs-richtexteditor htmlAttributes = "viewBag.htmlAttr"></ejs-richtexteditor> |
Is Responsive | Property: is-responsive <ej-rte is-responsive ="true"></ej-rte> |
No separate Property for responsive, provided default. |
Maximum Height | Property: max-height <ej-rte max-height="500px"></ej-rte> |
Not Applicable |
Maximum Width | Property: max-width <ej-rte max-width="700px"></ej-rte> |
Not Applicable |
Minimum Height | Property: min-height <ej-rte min-height="300px"></ej-rte> |
Not Applicable |
Minimum Width | Property: min-width <ej-rte min-width ="300px"></ej-rte> |
Not Applicable |
name | Property: name <ej-rte name = "commentBlog"></ej-rte> |
Not Applicable |
Clear All | Property: show-clear-all <ej-rte show-clear-all = "true"></ej-rte> |
Not Applicable |
Clear Format | Property: show-clear-format <ej-rte show-clear-format = "true"></ej-rte> |
No separate Property for clear Format. Its Provided in toolbar command.viewBag.item = new[] {"ClearFormat"} <ejs-richtexteditor><e-richtexteditor-toolbarsettings items="viewBag.item"></e-richtexteditor-toolbarsettings></ejs-richtexteditor> |
Place holder | Not Applicable | Property: placeholder<ejs-richtexteditor placeholder="Enter Text"></ejs-richtexteditor> |
Context Menu | Property: show-context-menu<ej-rte show-context-menu = "true"></ej-rte> |
Not Applicable |
Dimensions | Property: show-dimensions<ej-rte show-dimensions = "true"></ej-rte> |
Not Applicable |
Show Footer | Property: show-footer<ej-rte show-footer = "true"></ej-rte> |
Not Applicable |
Html Source | Property: show-html-source<ej-rte show-html-source = "true"></ej-rte> |
Method: showSourceCode() var rteObj = document.getElementById('richtexteditor').ej2_Instances[0]; rteObj.showSourceCode(); |
Html Tag Info | Property: show-html-tag-info<ej-rte show-html-tag-info = "true"></ej-rte> |
Not Applicable |
Rounded Corner | Property: show-rounded-corner<ej-rte show-rounded-corner = "true"></ej-rte> |
Not Applicable |
Tooltip | Property: tooltip-settings<ej-rte tooltip-settings = "viewBag.tooltip"></ej-rte> |
Not Applicable |
value | Property: value<ej-rte value = "ViewBag.value"></ej-rte> |
Property: value<ejs-richtexteditor value="ViewBag.value"></ejs-richtexteditor> |
Validation Rules | Property: validation-rules<ej-rte validation-rules= "ViewBag.validation"></ej-rte> |
Achieved in sample level. https://ej2.syncfusion.com/aspnetcore/documentation/rich-text-editor/validation.html#validation-rules |
Validation Message | Property: validation-message<ej-rte validation-message= "ViewBag.validation ></ej-rte> |
Achieved in sample level. https://ej2.syncfusion.com/aspnetcore/documentation/rich-text-editor/validation.html#validation-message |
Zoom Step | Property: zoom-step<ej-rte zoom-step = "0.5"></ej-rte> |
Not Applicable |
Disable | Method: disable() var rteObj = $("#rte ").data("ejRTE "); rteObj.disable() |
Property: enabled<ejs-richtexteditor enabled = "false"></ejs-richtexteditor> |
Enable | Method: enable()var rteObj = $("#rte ").data("ejRTE "); rteObj.enable() |
Property: enabled<ejs-richtexteditor enabled = "true"></ejs-richtexteditor> |
Focus | Method: focus() var rteObj = $("#rte ").data("ejRTE "); rteObj. focus() |
Method: focusIn() var rteObj = document.getElementById('richtexteditor').ej2_Instances[0]; rteObj. focusIn(); |
Focus Out | Not Applicable | Method: focusOut() var rteObj = document.getElementById('richtexteditor').ej2_Instances[0]; rteObj. focusOut(); |
Command Status | Method: getCommandStatus() var rteObj = $("#rte ").data("ejRTE "); rteObj.getCommandStatus() |
Not Applicable |
Get Document | Method: getDocument()var rteObj = $("#rte ").data("ejRTE "); rteObj.getDocument() |
Not Applicable |
Get Html | Method: getHtml() var rteObj = $("#rte ").data("ejRTE "); rteObj.getHtml() |
Method: getHtml() var rteObj = document.getElementById('richtexteditor').ej2_Instances[0]; rteObj. getHtml(); |
Get Text | Method: getText() var rteObj = $("#rte ").data("ejRTE "); rteObj.getText() |
Method: getContent() var rteObj = document.getElementById('richtexteditor').ej2_Instances[0]; rteObj. getContent(); |
Get Selected Html | Method: getSelectedHtml()var rteObj = $("#rte ").data("ejRTE "); rteObj.getSelectedHtml() |
Method: getSelection() var rteObj = document.getElementById('richtexteditor').ej2_Instances[0]; rteObj. getSelection(); |
Get Range | Not Applicable | Method: getRange() var rteObj = document.getElementById('richtexteditor').ej2_Instances[0]; rteObj. getRange(); |
Hide | Method: hide() var rteObj = $("#rte ").data("ejRTE "); rteObj.hide() |
Not Applicable |
Show | Method: show() var rteObj = $("#rte ").data("ejRTE "); rteObj.show() |
Not Applicable |
Insert Menu Option | Method: insertMenuOption() var rteObj = $("#rte ").data("ejRTE "); rteObj.insertMenuOption( {newItem:"Show Table Details",targetItem:"Table Properties", insertType:("insertAfter"), menuType:{text:false,image:false,hyperlink:false,table:true},spriteCssClass:"e-rte-toolbar-icon tableProperties"} ) |
Not Applicable |
Paste Content | Method: pasteContent(html) var rteObj = $("#rte ").data("ejRTE "); rteObj.pasteContent("Rich Text Editor content") |
Not Applicable |
refresh | Method: refresh() var rteObj = $("#rte ").data("ejRTE "); rteObj.refresh() |
Method: refresh() var rteObj = document.getElementById('richtexteditor').ej2_Instances[0]; rteObj.refresh(); |
Select All | Method: selectAll() var rteObj = $("#rte ").data("ejRTE "); rteObj.selectAll() |
Method: selectAll() var rteObj = document.getElementById('richtexteditor').ej2_Instances[0]; rteObj.selectAll(); |
Select Range | Method: selectRange() var rteObj = $("#rte ").data("ejRTE "); rteObj.selectRange() |
Method: selectRange() var rteObj = document.getElementById('richtexteditor').ej2_Instances[0]; rteObj.selectRange(); |
Set Html | Method: setHtml() var rteObj = $("#rte ").data("ejRTE "); rteObj.setHtml("rictexteditor content") |
Not Applicable |
Destroy | Not Applicable | Method: destroy() var rteObj = document.getElementById('richtexteditor').ej2_Instances[0]; rteObj.destroy(); |
Change | Event: change<ej-rte change = "onChange"></ej-rte> |
Event: change <ejs-richtexteditor change = "onChange"></ejs-richtexteditor> |
create | Event: create<ej-rte create = "onCreate"></ej-rte> |
Event: created <ejs-richtexteditor change = "onCreated"></ejs-richtexteditor> |
Context Menu Click | Event: contextMenuClick<ej-rte contextMenuClick = "onClick"></ej-rte> |
Not Applicable |
destroy | Event: destroy<ej-rte destroy = "onDestroy"></ej-rte> |
Event: destroyed <ejs-richtexteditor destroyed = "onDestroy"></ejs-richtexteditor> |
Pre Render | Event: preRender<ej-rte preRender = "onPreRender"></ej-rte> |
Not Applicable |
Select | Event: select<ej-rte select = "onSelect"></ej-rte> |
Not Applicable |
Focus | Not Applicable | Event: focus <ejs-richtexteditor focus = "onFocus"></ejs-richtexteditor> |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Execute Command | Method: executeCommand(cmdName, args, [textnodeType]) var rteObj = $("#rte ").data("ejRTE "); rteObj.executeCommand("bold", true) |
Method: executeCommand(cmdName, value) var rteObj = document.getElementById('richtexteditor').ej2_Instances[0]; rteObj. executeCommand("Bold" ); |
Execute events | Event: execute<ej-rte execute = "onExecute"></ej-rte> |
Event: actionComplete <ejs-richtexteditor actionComplete = "onActionComplete"></ejs-richtexteditor> |
Before Execute | Not Applicable | Event: actionBegin <ejs-richtexteditor actionBegin = "onActionBegin"></ejs-richtexteditor> |