Hi duyvt,
Thanks for using Syncfusion Products.
Query: I added an Insert button
to toolbar of @Html.EJ().RTE("htmlEditor"). When I click that button,
I want to insert text to Rich Text Area at place of cursor. How can I do that?
We have achieved your requirement (“To add the text in
RTE text area”).on clicking the AddText button in the RTE toolbar , the dialog
box will be open for entering the text. To insert the text, we have to create
the object for RTE in “allowText()” function and by using the object we have to
call “executeCommand” method.In that, you can add the text in RTE and please
find the below code snippet,
|
<script>
var rteObj;
function allowText() {
rteObj = $("#rteSample").data("ejRTE");
if (this._id == "src_insert") {
rteObj.executeCommand("inserthtml", $("#srcCode").val()); @*add the text in RTE*@
}
}
</script>
|
Also, we have prepared the sample based on this and it
available under the following location,
Sample Location: Sample
I also
want to add an icon to toolbar of RTE ?
We can add the no of custom tool in the RTE toolbar as
like add the insert button in the
previous query.As the same way,you can add the icon in the RTE toolbar and
please find the below code snippet for adding the icon in RTE toolbar,
|
[index.cshtml]
@Html.EJ().RTE("rteSample"). Tools(tool =>
tool.CustomTool(custom =>{
custom.Name("").Tooltip("Arrow icon").Css("icon").Add();
}))
|
And in the style
section, you can use specify the icon location for the specified class “icon”
as shown below,
|
[index.cshtml]
<style>
.icon {
background-image:url("../images/down.png");
height:24px;
width:17px;
}
<style>
|
We have achieved this in the above attached sample and please
let us know if you have further queries.
Regards,
Kasithangam
