Is there a Preview mode in Rich Text Editor

Hi. We are migrating a web forms project to Blazor and in one of our pages we have used TelerikRadControl for ASP.NET. The TelerikRadControl had three modes, Design, HTML and Preview. We have seen that the SyncFusion Rich Text Editor has HTML and Markdown mode but does it have a Preview mode?


1 Reply

VJ Vinitha Jeyakumar Syncfusion Team August 1, 2022 01:00 PM UTC

Hi Farjad,


We have prepared a sample to achieve your requirement to have a preview mode with Rich Text Editor. please check the code and sample below,

Code snippet:
<SfButton @onclick="@Preview">Preview</SfButton>

<SfRichTextEditor Readonly="Read">
    <RichTextEditorToolbarSettings Items="@Tools" Enable="ToolEnable" />
    <p>The Rich Text Editor component is WYSIWYG ('what you see is what you get') editor that provides the best user experience to create and update the content. Users can format their content using standard toolbar commands.</p>
    <p><b> Key features:</b></p>
    <ul>
        <li><p> Provides <b>IFRAME</b> and <b>DIV</b> modes </p></li>
        <li><p> Capable of handling markdown editing.</p></li>
        <li><p> Contains a modular library to load the necessary functionality on demand.</p></li>
        <li><p> Provides a fully customizable toolbar.</p></li>
        <li><p> Provides HTML view to edit the source directly for developers.</p></li>
        <li><p> Supports third - party library integration.</p></li>
        <li><p> Allows preview of modified content before saving it.</p></li>
    </ul>
</SfRichTextEditor>

@code {
    public bool Read { get; set; } = false;
    public bool ToolEnable { get; set; } = true;
    public void Preview()
    {
        Read = !Read;
        ToolEnable = !ToolEnable;

    }
 
}



Regards,
Vinitha

Loader.
Up arrow icon