SfRichTextEditor in SfDataForm FormItem Template improper rendering.

[Hunter Malley]

I am attempting to use an SfRichTextEditor component as a FormItem in an SfDataForm component in a .NET MAUI Blazor Hybrid application and am experiencing rendering issues on the RTE. The RTE renders with a width that exceeds the width of the form and the viewport. When I do not include a set of <Template/> tags in the <FormItem/>, around the RTE, the component width is rendered correctly, but is placed at the wrong position in the form, at the top. I am using Syncfusion.Blazor.* v28.2.4 packages. 

Link to Fiddle. Please note in the fiddle, the issue is seen when reducing the output screen size to a smaller width, representative of that of a mobile phone screen.

[Vinitha Jeyakumar]

Hi Hunter Malley,

Your reported issue can be resolved by customizing the CSS styles of form layout like below,

Code snippet:

 

<style>

    .e-data-form .e-form-layout {

         display: block;

     }

 </style>

Please check the modified sample below,

https://blazorplayground.syncfusion.com/embed/hZLoDVitUftPQfDd?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5

Regards,

Vinitha

[Hunter Malley]

That resolved the issue. 

Thank you.

[Vinitha Jeyakumar]

Hi Hunter Malley,

You are welcome.

Regards,

Vinitha