The RichTextEditor's toolbar blocks (overflows into) the first couple of lines of document.

[Mithun]

Hello Syncfusion Team,

I'm using the latest version of syncfusion's angular components (17.4.47).

I have a rich text editor placed inside a dialog control. 

The RichTextEditor's toolbar blocks (overflows into) the first couple of lines of document. Switching the toolbar to 'Expand' from 'MultiRow' does not help. 

Please see this stackblitz demo: https://stackblitz.com/edit/rte-toolbar-block

After the dialog opens, you'll have to click 'enter' key a couple of times so that the next couple of lines become visible.

Please let me know how this can be addressed.

Thanks,

Mithun  

[Indrajith Srinivasan]

Hi Mithun, 

 

Greetings from Syncfusion support, 

 

We have validated your reported query, the RichTextEditor width is not calculated properly when rendering inside the Dialog. So, Switching the toolbar to `Expand` from `MultiRow` does not depends on this toolbar issue. We suggest you call the RichTextEditor refreshUI() method in the Dialog Open event to resolve the reported issue. We have also prepared a sample based on your requirement. 

 

API link: https://ej2.syncfusion.com/angular/documentation/api/rich-text-editor/#refreshui 

Sample: https://stackblitz.com/edit/rte-toolbar-block-zgxqww?file=src/app/app.component.ts 

 

Regards, 

Indrajith 

[Mithun]

Hi Indrajith,

Thanks! That solution worked. Highly appreciate it.

Thanks,

-Mithun

[Indrajith Srinivasan]

Hi Mithun,

Thanks for the update, 

  

We are glad that your reported issue is resolved. Please let us know if you need any further assitance on this. 

  

Regards, 

Indrajith