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: AllowKeyboardNavigation @{Html.EJ().RichTextEditor("rteSample").AllowKeyboardNavigation(true).Render();} |
No separate Property for enable/disable keyboard navigation. Its enabled by default. |
Localization | Property: Locale @{Html.EJ().RichTextEditor("rteSample").Locale("en-US").Render();} |
Property: Locale @Html.EJS().RichTextEditor("default").Locale("en-US").Render() |
RTL | Property: EnableRtl@{Html.EJ().RichTextEditor("rteSample").EnableRTL(true).Render();} |
Property: EnableRtl @Html.EJS().RichTextEditor("rtl").EnableRtl(true).Render() |
Key Config | Not Applicable | Property: KeyConfig@Html.EJS().RichTextEditor("default").KeyConfig((object)ViewBag.keyConfig).Render() |
Tab Key Navigation | Property: EnableTabKeyNavigation @{Html.EJ().RichTextEditor("rteSample").EnableTabKeyNavigation(true).Render();} |
Property: EnableTabKey@Html.EJS().RichTextEditor("default").EnableTabKey(true).Render() |
Key Down | Event: KeyDown@{Html.EJ().RichTextEditor("rteSample").ClientSideEvents(evt => evt.KeyDown("onKeydown")).Render();} |
Not Applicable |
Key Up | Event: keyUp@{Html.EJ().RichTextEditor("rteSample").ClientSideEvents(evt => evt.keyUp("keyUp")).Render();} |
Not Applicable |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
showToolbar | Property: ShowToolbar@{Html.EJ().RichTextEditor("rteSample").ShowToolbar(true).Render();} |
Property: Enable @Html.EJS().RichTextEditor("types").Value((string)ViewBag.value).Height("720px").ToolbarSettings(e => e.Enable(true)).Render() |
Tools item | Property: Tools List<String> lists = new List<string>() { "unorderedList", "orderedList" }; @{Html.EJ().RichTextEditor("rteSample").Tools(tool => tool.Lists(lists)).Render();} |
Property: Items@Html.EJS().RichTextEditor("customtool").ToolbarSettings(e => e.Items((object)ViewBag.items)).Render() |
Tools-list | Property: ToolsList@{ List<String> toolsList = new List<string>() { "style", "lists", "doAction", "links", "images" }; @{Html.EJ().RichTextEditor("rteSample").ToolsList(toolsList).Render();} |
Property: Items@Html.EJS().RichTextEditor("customtool").ToolbarSettings(e => e.Items((object)ViewBag.items)).Render() |
Toolbar Overflow Mode | Property: ToolbarOverflowMode @{Html.EJ().RichTextEditor("rteSample").ToolbarOverflowMode(ToolbarOverflowMode.Inline).Render();} |
Property: Type 1.Expand 2.MultiRow @Html.EJS().RichTextEditor("types").ToolbarSettings(e => e.Type(Syncfusion.EJ2.RichTextEditor.ToolbarType.Expand)).Render() |
Floating Toolbar | Not Applicable | Property: EnableFloating @Html.EJS().RichTextEditor("types").ToolbarSettings(e =>e.EnableFloating(true)).Render() |
Floating Toolbar Offset | Not Applicable | Property: FloatingToolbarOffset @Html.EJS().RichTextEditor("types").ToolbarSettings(e =>e.EnableFloating(true)).FloatingToolbarOffset(50).Render() |
Inline toolbar | Not Applicable | Property: InlineMode@Html.EJS().RichTextEditor("defaultRTE").Value((string)ViewBag.value).InlineMode(e=>e.Enable(true).OnSelection(true)).ToolbarSettings(e => e.Items((object)ViewBag.items)).Render() |
Quick Toolbar | Not Applicable | Property: Quicktoolbarsettings1.image 2.link 3.table 4.clipboard @Html.EJS().RichTextEditor("inline").ToolbarSettings(e => e.Items((object)ViewBag.items)).QuickToolbarSettings(e =>e.Image((object)ViewBag.image)).Format(t=>t.Width("40px")).Value((string)ViewBag.value).Render() |
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: ToolbarClick @Html.EJS().RichTextEditor("defaultRTE").ToolbarClick("onClick").Render() |
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 @{Html.EJ().RichTextEditor("rteSample").Format(format).Render();} |
Property: Format @Html.EJS().RichTextEditor("defaultRTE").Format(t=>t.Width("70px").Default("Paragraph").Types("items")).ToolbarSettings(e => e.Items((object)ViewBag.items)).Render() |
Font Size | Property: FontSize @{Html.EJ().RichTextEditor("rteSample").FontSize(size).Render();} |
Property: FontSize@Html.EJS().RichTextEditor("defaultRTE").FontSize(t=>t.Width("70px").Default("Paragraph").Types("items")).ToolbarSettings(e => e.Items((object)ViewBag.items)).Render() |
Font Family | Property: FontName@{Html.EJ().RichTextEditor("rteSample").FontName(fontname).Render();} |
Property: FontFamily@Html.EJS().RichTextEditor("defaultRTE").FontFamily(t=>t.Width("70px").Default("Paragraph").Types("items")).ToolbarSettings(e => e.Items((object)ViewBag.items)).Render() |
Show Font Option | Property: ShowFontOption@{Html.EJ().RichTextEditor("rteSample").ShowFontOption(true).Render();} |
Property: FontFamilyviewBag.fontFamily = new {default= "0", types = "items", width = "70px"} @Html.EJS().RichTextEditor("defaultRTE").FontFamily(f=>e.Items((object)ViewBag.fontFamily)).ToolbarSettings(e => e.Items((object)ViewBag.items)).Render() |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Font Color | Property: ColorCode @{Html.EJ().RichTextEditor("rteSample").ColorCode(colorCode).Render();} |
Property: FontColor@Html.EJS().RichTextEditor("defaultRTE").FontColor(t=>t.columns("10").default("'#fff).modeSwitcher(false)).ToolbarSettings(e => e.Items((object)ViewBag.items)).Render() |
Background Color | Not Applicable | Property: BackgroundColor@Html.EJS().RichTextEditor("defaultRTE").BackgroundColor(t=>t.columns("10").Default("'#fff).ModeSwitcher(false).Mode("Palette")).ToolbarSettings(e => e.Items((object)ViewBag.items)).Render() |
Color Palette Columns | Property: ColorPaletteColumns @{Html.EJ().RichTextEditor("rteSample").ColorPaletteColumns(10).Render();} |
Property: BackgroundColor@Html.EJS().RichTextEditor("defaultRTE").BackgroundColor(b=>b.Columns(10)).ToolbarSettings(e => e.Items((object)ViewBag.items)).Render() |
Color Palette Rows | Property: ColorPaletteRows @{Html.EJ().RichTextEditor("rteSample").ColorPaletteRows(6).Render();} |
Not Applicable |
Color Picker Type | Method: setColorPickerType () var rteObj = $("#rte ").data("ejRTE "); rteObj.setColorPickerType("picker") |
Property: ColorModeType @Html.EJS().RichTextEditor("defaultRTE").BackgroundColor(b=>b.Mode("Palette")).ToolbarSettings(e => e.Items((object)ViewBag.items)).Render() |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Link | Not Applicable | Property: CreateLinkviewBag.item = new[] {"CreateLink"} @Html.EJS().RichTextEditor("defaultRTE").ToolbarSettings(e => e.Items((object)ViewBag.items)).Render() |
Quick Toolbar | Not Applicable | Property: LinkviewBag.link = new [] {Open, Edit, UnLink} @Html.EJS().RichTextEditor("defaultRTE").ToolbarSettings(e => e.Items((object)ViewBag.items)).QuickToolbarSettings(e => e.Link((object)ViewBag.link)).Render() |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Image | Not Applicable | Property: Image viewBag.item = new[] {"Image"} @Html.EJS().RichTextEditor("defaultRTE").ToolbarSettings(e => e.Items((object)ViewBag.items)).Render() |
Quick Toolbar | Not Applicable | Property: Image viewBag.link = new [] {"Replace", "Align", "Caption", "Remove", "-", "InsertLink","OpenImageLink", "EditImageLink", "RemoveImageLink", "Display", "AltText", "Dimension"} @Html.EJS().RichTextEditor("defaultRTE").ToolbarSettings(e => e.Items((object)ViewBag.items)).QuickToolbarSettings(e => e.Image((object)ViewBag.image)).Render() |
Image Setting | Property: ImagesList<String> images = new List<string>() { "image" }; @{Html.EJ().RichTextEditor("rteSample").Tools(tool=>tool.Image(image)).Render();} |
Property: InsrtImageSettings @Html.EJS().RichTextEditor("image").ToolbarSettings(e => e.Items((object)ViewBag.items)).InsertImageSettings(obj=>obj.Display("inline")).Value((string)ViewBag.value).Render() |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Table | Not Applicable | Property: CreateTableviewBag.item = new[] {"CreateTable"} @Html.EJS().RichTextEditor("table").ToolbarSettings(e => e.Items((object)ViewBag.items)).Render() |
Quick Toolbar | Not Applicable | Property: TableviewBag.table = new [] {"TableHeader", "TableRows", "TableColumns", "BackgroundColor", "-", "TableRemove", "Alignments", "TableCellVerticalAlign", "Styles" } @Html.EJS().RichTextEditor("defaultRTE").ToolbarSettings(e => e.Items((object)ViewBag.items)).QuickToolbarSettings(e => e.Table((object)ViewBag.table)).Render() |
Table Setting | Property: TableColumns, TableRows@{Html.EJ().RichTextEditor("rteSample").TableColumns(10).Render();} @{Html.EJ().RichTextEditor("rteSample").TableRows(10).Render();} |
Property: TableSettings@Html.EJS().RichTextEditor("image").ToolbarSettings(e => e.Items((object)ViewBag.items)).TableSettings(obj=>obj.width("80%")).Render() |
Custom table | Property: ShowCustomTable@{Html.EJ().RichTextEditor("rteSample").ShowCustomTable(true).Render();} |
Not Applicable |
Insert Column | Method: insertColumn([before],[cell])var rteObj = $("#rte ").data("ejRTE "); rteObj.insertColumn(true, "<td></td>") |
Property: TableColumns viewBag.table = new [] {"TableColumns"} @Html.EJS().RichTextEditor("defaultRTE").ToolbarSettings(e => e.Items((object)ViewBag.items)).QuickToolbarSettings(e => e.Table((object)ViewBag.table)).Render() |
Insert Row | Method: insertRow([before],[cell]) var rteObj = $("#rte ").data("ejRTE "); rteObj.insertRow(true, "<tr></tr>") |
Property: TableRows viewBag.table = new [] {"TableRows"} @Html.EJS().RichTextEditor("defaultRTE").ToolbarSettings(e => e.Items((object)ViewBag.items)).QuickToolbarSettings(e => e.Table((object)ViewBag.table)).Render() |
Remove Table | Method: removeTable([table])var rteObj = $("#rte").data("ejRTE "); rteObj.removeTable("table") |
Property: TableRemove viewBag.table = new [] {"TableRemove"} @Html.EJS().RichTextEditor("defaultRTE").ToolbarSettings(e => e.Items((object)ViewBag.items)).QuickToolbarSettings(e => e.Table((object)ViewBag.table)).Render() |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Character Count | Property: ShowCharCount@{Html.EJ().RichTextEditor("rteSample").ShowCharCount(true).Render();} |
Property: ShowCharCount@Html.EJS().RichTextEditor("defaultRTE").ToolbarSettings(e => e.Items((object)ViewBag.items)).ShowCharCount(true).Render() |
Word Count | Property: ShowWordCount@{Html.EJ().RichTextEditor("rteSample").ShowWordCount(true).Render();} |
Not Applicable |
Maximum Length | Property: MaxLength @{Html.EJ().RichTextEditor("rteSample").MaxLength(1000).Render();} |
Property: MaxLength@Html.EJS().RichTextEditor("defaultRTE").MaxLength(1000).Render() |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Enable Iframe | By Default, enabled | Property: IframeSettings@Html.EJS().RichTextEditor("iframe").Value((string)ViewBag.value).IframeSettings(iframeSettings => iframeSettings.Enable(true)).Render() |
Attributes | Property: IFrameAttributes@{Html.EJ().RichTextEditor("rteSample").Width("800px").IFrameAttributes(new Dictionary<string, object> { { "style", "background-color:#e0ffff color:#6495ed;" } }).Render();} |
Property: Attributes @Html.EJS().RichTextEditor("iframe").Value((string)ViewBag.value).Height("500").IframeSettings(iframeSettings => iframeSettings.Enable(true)).Render() <script>var iframeRTE; function created() { iframeRTE = this; this.setProperties({ iframeSettings: { enable: true, attributes: { readonly: "readonly"} } }, false); } </script> |
Resource | Property: external-CSS@{Html.EJ().RichTextEditor("rteSample").ExternalCSS("/Content/Css/iframe-custom.css").Render();} |
Property: Attributes@Html.EJS().RichTextEditor("iframe").Value((string)ViewBag.value).Height("500").IframeSettings(iframeSettings => iframeSettings.Enable(true)).Render() <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 @Html.EJS().RichTextEditor("types").Value((string)ViewBag.value).EditorMode(EditorMode.Html).Render() |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Undo Stack Limit | Property: UndoStackLimit @{Html.EJ().RichTextEditor("rteSample").UndoStackLimit(50).Render();} |
Property: UndoRedoSteps @Html.EJS().RichTextEditor("types").Value((string)ViewBag.value).UndoRedoSteps(30).Render() |
Undo Redo Timer | Not Applicable | Property: UndoRedoTimer@Html.EJS().RichTextEditor("types").Value((string)ViewBag.value).UndoRedoTimer(300).Render() |
Behavior | API in Essential JS 1 | API in Essential JS 2 |
---|---|---|
Allow Editing | Property: AllowEditing @{Html.EJ().RichTextEditor("rteSample").AllowEditing(true).Render();} |
Property: Readonly@Html.EJS().RichTextEditor("default").Readonly(true).Render() |
Auto Focus | Property: AutoFocus @{Html.EJ().RichTextEditor("rteSample").AutoFocus(true).Render();} |
Not Applicable |
Auto Height | Property: AutoHeight @{Html.EJ().RichTextEditor("rteSample").AutoHeight(true).Render();} |
Not Applicable |
Paste Clean Up | Property: paste-cleanup-settings @{Html.EJ().RichTextEditor("rteSample").PasteCleanupSettings(c=>c.CleanCSS(true).CleanElements(true).ListConversion(true).RemoveStyles(true)).Render();} |
Not Applicable |
Css Class | Property: CssClass @{Html.EJ().RichTextEditor("rteSample").CssClass("customstyles").Render();} |
Property: CssClass @Html.EJS().RichTextEditor("default").CssClass("customStyle").Render() |
Enabled | Property: Enabled @{Html.EJ().RichTextEditor("rteSample").Enabled(true).Render();} |
Property: Enabled@Html.EJS().RichTextEditor("default").Enabled(true).Render() |
Html Encode | Property: EnableHtmlEncode @{Html.EJ().RichTextEditor("rteSample").EnableHtmlEncode(true).Render();} |
Property: EnableHtmlEncode@Html.EJS().RichTextEditor("default").EnableHtmlEncode(true).Render() |
Persistence | Property: EnablePersistence @{Html.EJ().RichTextEditor("rteSample").EnablePersistence(true).Render();} |
Property: EnablePersistence@Html.EJS().RichTextEditor("default").EnablePersistence(true).Render() |
Resize | Property: EnableResize @{Html.EJ().RichTextEditor("rteSample").EnableResize(true).Render();} |
Not Applicable |
XHTML | Property: EnableXHTML @{Html.EJ().RichTextEditor("rteSample").EnableXHTML(true).Render();} |
Not Applicable |
Height | Property: Height @{Html.EJ().RichTextEditor("rteSample").Height("350px").Render();} |
Property: Height@Html.EJS().RichTextEditor("default").Height("300px").Render() |
Width | Property: Width @{Html.EJ().RichTextEditor("rteSample").Width("500px").Render();} |
Property: Width @Html.EJS().RichTextEditor("default").Width("500px").Render() |
Html Attributes | Property: HtmlAttributes @{Html.EJ().RichTextEditor("rteSample").Width("800px").HtmlAttributes(htmlattr).Render();} |
Property: HtmlAttributes@Html.EJS().RichTextEditor("default").HtmlAttributes((object)ViewBag.attr)).Render() |
Is Responsive | Property: IsResponsive @{Html.EJ().RichTextEditor("rteSample").IsResponsive(true).Render();} |
No separate Property for responsive, provided default. |
Maximum Height | Property: MaxHeight @{Html.EJ().RichTextEditor("rteSample").MaxHeight("500px").Render();} |
Not Applicable |
Maximum Width | Property: MaxWidth @{Html.EJ().RichTextEditor("rteSample").MaxWidth("500px").Render();} |
Not Applicable |
Minimum Height | Property: MinHeight @{Html.EJ().RichTextEditor("rteSample").MinHeight("300px").Render();} |
Not Applicable |
Minimum Width | Property: MinWidth @{Html.EJ().RichTextEditor("rteSample").MinWidth("300px").Render();} |
Not Applicable |
name | Property: name @{Html.EJ().RichTextEditor("rteSample").name("commentBlog").Render();} |
Not Applicable |
Clear All | Property: ShowClearAll @{Html.EJ().RichTextEditor("rteSample").ShowClearAll(true).Render();} |
Not Applicable |
Clear Format | Property: ShowClearFormat @{Html.EJ().RichTextEditor("rteSample").ShowClearFormat(true).Render();} |
No separate Property for clear Format. Its Provided in toolbar command.viewBag.item = new[] {"ClearFormat"} @Html.EJS().RichTextEditor("default").ToolbarSettings(e => e.Items((object)ViewBag.item)).Render() |
Place holder | Not Applicable | Property: Placeholder@Html.EJS().RichTextEditor("default").Placeholder("Enter the text").Render() |
Context Menu | Property: ShowContextMenu@{Html.EJ().RichTextEditor("rteSample").ShowContextMenu(true).Render();} |
Not Applicable |
Dimensions | Property: ShowDimensions@{Html.EJ().RichTextEditor("rteSample").ShowDimensions(true).Render();} |
Not Applicable |
Show Footer | Property: ShowFooter<@{Html.EJ().RichTextEditor("rteSample").ShowFooter(true).Render();} |
Not Applicable |
Html Source | Property: ShowHtmlSource@{Html.EJ().RichTextEditor("rteSample").ShowHtmlSource(true).Render();} |
Method: showSourceCode() var rteObj = document.getElementById("richtexteditor").ej2_Instances[0]; rteObj.showSourceCode(); |
Html Tag Info | Property: ShowHtmlTagInfo@{Html.EJ().RichTextEditor("rteSample").ShowHtmlTagInfo(true).Render();} |
Not Applicable |
Rounded Corner | Property: ShowRoundedCorner@{Html.EJ().RichTextEditor("rteSample").ShowRoundedCorner(true).Render();} |
Not Applicable |
Tooltip | Property: TooltipSettings@{Html.EJ().RichTextEditor("rteSample").TooltipSettings(tooltip=>tooltip.ShowShadow(false)).Render();} |
Not Applicable |
value | Property: Value@{Html.EJ().RichTextEditor("rteSample").Value("The Rich Text Editor (RichTextEditor) control is an easy to render in client side.").Render();} |
Property: Value@Html.EJS().RichTextEditor("types").Value((string)ViewBag.value).Height("720px").ToolbarSettings(e => { e.Enable(true); }).Render() |
Validation Rules | Property: ValidationRules@{Html.EJ().RichTextEditor("rteSample").ValidationRules(new Dictionary<string, object> { { "required", "true" }, { "minWordCount", 15 } }).Render();} |
Achieved in sample level. https://ej2.syncfusion.com/aspnetmvc/documentation/rich-text-editor/validation.html#validation-rules |
Validation Message | Property: ValidationMessage@{Html.EJ().RichTextEditor("rteSample").ValidationMessage(new Dictionary<string, object> { { "minWordCount", "A minimum of {10} words is required here" }, { "Required", "Please enter the content" } }).Render();} |
Achieved in sample level. https://ej2.syncfusion.com/aspnetmvc/documentation/rich-text-editor/validation.html#validation-message |
Zoom Step | Property: ZoomStep@{Html.EJ().RichTextEditor("rteSample").ZoomStep("0.5").Render();} |
Not Applicable |
Disable | Method: disable() var rteObj = $("#rte ").data("ejRTE "); rteObj.disable() |
Property: Enabled@Html.EJS().RichTextEditor("default").Enabled(false).Render() |
Enable | Method: enable()var rteObj = $("#rte ").data("ejRTE "); rteObj.enable() |
Property: Enabled@Html.EJS().RichTextEditor("default").Enabled(true).Render() |
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@{Html.EJ().RichTextEditor("rteSample").ClientSideEvents(evt => evt.Change("onChange")).Render();} |
Event: Change @Html.EJS().RichTextEditor("defaultRTE").Change("onChange").Render() |
create | Event: Create@{Html.EJ().RichTextEditor("rteSample").ClientSideEvents(evt => evt.Create("onCreate")).Render();} |
Event: Created @Html.EJS().RichTextEditor("defaultRTE").Created("onCreated").Render() |
Context Menu Click | Event: ContextMenuClick@{Html.EJ().RichTextEditor("rteSample").ClientSideEvents(evt => evt.ContextMenuClick("onContextMenuClick")).Render();} |
Not Applicable |
destroy | Event: Destroy@{Html.EJ().RichTextEditor("rteSample").ClientSideEvents(evt => evt.Destroy("onDestroy")).Render();} |
Event: Destroyed @Html.EJS().RichTextEditor("defaultRTE").Destroyed("onDestroyed").Render() |
Pre Render | Event: PreRender@{Html.EJ().RichTextEditor("rteSample").ClientSideEvents(evt => evt.PreRender("onPreRender")).Render();} |
Not Applicable |
Select | Event: Select@{Html.EJ().RichTextEditor("rteSample").ClientSideEvents(evt => evt.Select("onSelect")).Render();} |
Not Applicable |
Focus | Not Applicable | Event: Focus @Html.EJS().RichTextEditor("defaultRTE").Focus("onFocus").Render() |
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@{Html.EJ().RichTextEditor("rteSample").ClientSideEvents(evt => evt.Execute("onExecute")).Render();} |
Event: ActionComplete @Html.EJS().RichTextEditor("defaultRTE").ActionComplete("onActionComplete").Render() |
Before Execute | Not Applicable | Event: ActionBegin @Html.EJS().RichTextEditor("defaultRTE").ActionBegin("onActionBegin").Render() |