We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

Custom Tool for Rich Text Editor


I am finding it difficult to get a custom tool working with the rich text editor control.  The purpose of the custom tool is to provide a dropdown list of insertable fields into the content of RTE.  For example, one option in the dropdown would be 'First Name', and as a result of selecting this item, the value '#Firstname#' would be inserted into the content.

So far I have managed to get a control on to the toolbar:

But I am yet to get it to do anything useful.  Ideally it would display a list of fields, a bit like the Paragraph tool except, it would display selectable fields rather than paragraph formatting types.

Any help you can provide would be greatly appreciated.

Best regards
Daniel Williams

1 Reply

PO Prince Oliver Syncfusion Team November 20, 2018 10:30 AM UTC

Hi Daniel,  
Thank you for using Syncfusion products. 
We have checked your requirement for custom tool in RTE control with DropDownList. We can render the DropDownList control inside RTE and insert the selected value into editor using  insertHtml” method. Kindly refer to the following code snippet. 
change: (args: any)=>{ 
    InsertHtml.Insert(document, document.createTextNode(args.value)); 
We prepared a sample as per your requirement, please find the sample at the following location: https://stackblitz.com/edit/angular-8i57rh-jqdzpw  
Please let us know if you require any further assistance on this.   

Live Chat Icon For mobile
Up arrow icon