Radzen Text Area - how to render formatted HTML?

Radzen.Blazor Components
1

Hi,
Is it possible to display formatted HTML in the Text Area?

...
 <RadzenFieldset Text="Sales Contract">
     <RadzenStack Gap="1rem">
        <RadzenTextArea Rows="7" @bind-Value="order.SalesContract" Change=@(args => OnChange(args)) Style="width: 100%" aria-label="TextArea" />
     </RadzenStack>
 </RadzenFieldset>
...

public class Order
{
    public string SalesContract { get; set; }
    
}

Order order = new Order()
    {
        SalesContract = "<b>This is a sales contract. Please read carefully.</b><br>" + 
                                       "• Lorem ipsum dolor sit amet, consectetur adipiscing elit.<br>" +
                                       "• Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<br>" +
                                       "• Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.<br>" +
                                       "• Nisi ut aliquip ex ea commodo consequat."

    };
2

You cannot display HTML in a TextArea.

3

You can probably use RadzenHtmlEditor if you want your users to edit the content.

4

Is it possible to remove all of the buttons etc from the html editor?

image
image856×327 10.2 KB

<RadzenFieldset Text="Sales Contract">
    <RadzenStack Gap="1rem">
               <RadzenHtmlEditor @bind-Value="order.SalesContract" Style="width: 100%" >
            <RadzenHtmlEditorCustomTool />
        </RadzenHtmlEditor>
    </RadzenStack>
</RadzenFieldset>
5

Do you want the HTML to be editable at all? If not - just display it.

6

I want HTML to be editable.

By the way, is it possible to edit HTML to display bold with b tag? I mean when I make bold some part of the text above it seems that it adds styles.

<b>This is a sales contract. Please read carefully.</b><br>• Lorem ipsum dolor sit amet, consectetur adipiscing elit.<br><span style="font-weight: bold;">• Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</span><br>• Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.<br>• Nisi ut aliquip ex ea commodo consequat.

7

"Just display it". How? I can get the text to display properly using the HtmlEditor control. However, the "cog wheel" displays and I don't need it. The background color of the editor control doesn't seem to be configurable. I've tried setting a style "background-color: transparent" with no luck.

I'd much rather just use a RadzenText control to display the text, but this shows the HTML tags as text (and attempting to convert the text using MarkupString throws errors).

8

I replied to your other thread @MBonafe. You don't need RadzenHtmlEditor if you don't want to edit anything.

1 Like