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

Add Custom Button in Toolbar

Hey I am new to Syncfusion, want to integrate DocumentEditorContainer in angular application and want to use mail merge, is there any option to add custom button in editor toolbar or any other way to open dragable list inside documenteditor. Please Help

1 Reply

HC Harini Chellappa Syncfusion Team November 19, 2019 01:31 PM UTC

Hi Deepak, 

want to use mail merge, 
To perform mail merge in DocumentEditor, we don’t have built-in mail merge functionality. You can perform Mail-merge in server side by using Syncfusion.DocIO library.    
    
You can find more detail about mail merge functionality from below UG link.   
    
  
Here is KB documentation in MVC 

is there any option to add custom button in editor 
Currently Document editor doesn’t provide any public API to customize the toolbar.  
You can follow any of the below options. 

## Disable Toolbar  
You can hide the existing toolbar in DocumentEditor by set enableToolbar property as false.  
Sample code snippet 
<ejs-documenteditorcontainer #documenteditor_default [enableToolbar]=false (created)="onCreate()" style="display:block;height:600px"></ejs-documenteditorcontainer> 
 

## Custom Toolbar 
You can create customize toolbar for document editor based on your requirement.  
  
Please find more details about custom toolbar from below documentation link    
Toolbar with paragraph formatting options alone:   
  
  
Toolbar with Text formatting with text formatting options alone:   
  
 
  
Note: We have also logged this as feature request. Please track the below feedback link for feature status.  
  
any other way to open dragable list inside documenteditor. 
You can drag and drop list view content and insert it as field in document editor. 

You can insert field in document editor using insertField method in editor module.    

Code snippet 
this.container.documentEditor.editor.insertField('MERGEFIELD '+text+' \\* MERGEFORMAT', '{{'+text+'}}');   
First parameter refers field code and second parameter refers display text.  
    
We have prepared the sample with drag and drop list view options and insert the text as merge field in document editor. Please download it from the below link and let us know if this helps you. 
    



Regards, 
Harini C 


Loader.
Live Chat Icon For mobile
Up arrow icon