If a user creates an unordered list and then decides to switch to an ordered list, they can do it simply by clicking on the "Insert Ordered List" button and vice versa.

However, if the list another list nested within it, the action either does not work or exhibits weird behavior. Please have a look at the attached example project containing the editor and a sample nested list string.

1. Placing your cursor within the outer ordered list highlights the "Insert Ordered List" button. Clicking on the "Insert Unordered List" button will either fail, create a weird intermediate level only for the item currently containing the cursor, or only change the item currently under the cursor.

2. Attempting to highlight the entire list will also highlight both the Insert List buttons. Clicking on Insert Ordered List will flatten the whole thing into paragraphs. Clicking on Insert Unordered List will mess up the list.

I expect the editor should more or less work similarly to the form in which I'm typing this message.

Previously if content in HTML view of Editor exceeded height a scroll bar would appear like below (v2.29).

Now there is no scroll bar and you have to press the down arrow to get further in the content (v.3.0.1) .

to fix this locally I added CSS overflow: auto to .k-textarea

I couldn't find the Preview Tool button in the Editor.

Please help me with that, how can I add that functionality into the Editor?

I need help to format/pretty HTML code in the viewhtml dialog box in the Editor. Plus, I couldn't find any property on the ViewHtml class that allows setting the content when the dialog box is open.

See Blazor ViewHtml dialog formatting.

See Kendo ViewHtml dialog formatting.

Hi,

I tried looking through the docs and api reference for the Blazor Editor, but I can't seem to find any resizable property like the one found in the ASP.NET Core component here: ASP.NET Core Editor - Api Reference | Telerik UI for ASP.NET Core

I just wanted to check that this feature is not included in the editor for Blazor before I submitted a feature request. I tried to search the requests as well and I didn't see this request listed. 

If this feature does not exist, do you know if it is being currently considered for a future release or if there is a workaround?

Thank you,

Frank

It looks like the Iframes now work, but a Video tag with Source tags does not, like the following:

<video class='embed-responsive embed-responsive h-100' controls='controls'>

<source src= '/File/101' type='video/webm' />

<source src='/File/108' type='video/mp4' />

</video>

The View HTML Button will remove the whole video tag. And the 'insertHtml' will throw an Error on the JS Console.

These Tags are necessary because different browsers and OSs may not be able to display certain media types. So usually you provide multiple sources for the different requirements. Is there a way to allow these Tags in the 'insertHtml' Method?

Hi!

When using the Telerik Editor for Blazor, especially the insert HTML function, something seems a little odd.

I reproduced the same behaviour of my application in your demos on your website.

It seems like it is currently not possible to insert a HTML with multiple Lines in it, it only inserts the first line within the given value.

For better understanding, I've attached a video which displays the behaviour.

The HTML i've used:

<p>Test</p><p><br /></p><p>with</p><p><br /></p><p>Line</p><p><br /></p><p>breaks</p><p><br /></p><p><br /></p><p>1</p><p><br /></p><p>2</p><p><br /></p><p>3</p><p><br /></p>

Especially when you are working with HTML-Templates, it is necessary to be able to insert a rich HTML Template with multiple lines, tables, etc..

Thank you for your help in advance!

Best regards,

Stefan

I do have a default word content available for the user, and the user will be able to change the content if required. 

The track change feature would allow reviewers to quickly zoom into the edited wording (i.e. highlighted in red) for them to review quickly.

---

ADMIN EDIT

If such a feature were to be implemented as part of the component feature set, it is likely to show diff via CSS and HTML elements and would not likely compare against a Word (or any other) document.

For the time being, you can consider a custom button that will do an HTML diff against the original content that was provided to it to show it in the editor, but reconciling any changes will be a more complex task that is very far from trivial to implement.

When the Editor is disabled, the user can still focus it by tabbing and edit the content. The issue occurs in both Div and Iframe EditMode.

Click on the textbox and press TAB:

<input type="text" tabindex="0" />

<TelerikEditor Enabled="false"
			  EditMode="@EditorEditMode.Div"
			  Height="200px" />

Currently, the Insert Image Dialog for the editor labels doesn't look great. the first two seem right-aligned and the second two items seem left-aligned. this screenshot is from the demo site.

Please expose the ability to allow additional HTML attributes in the Editor content.

===ADMIN EDIT===

Provide support for:

• custom attributes for the Editor elements
• custom tags

I would like to be able to customize the content of the Iframe in the Editor with CSS.

===

Telerik edit:

In the meantime, it is possible to inject CSS styles in the Editor <iframe> with JavaScript:

@inject IJSRuntime js

<TelerikEditor @bind-Value="@EditorValue" />

@* Move scripts to separate js files in production. *@
<script suppress-error="BL9992">
    function injectEditorStyleTag() {
        var doc = document.querySelector("iframe").contentWindow.document;
        var head = doc.querySelector("head");
        
        var style = doc.createElement("style");
        style.type = "text/css";
        
        var css = "body { background: #fed; font-size: 24px; }";
        
        style.appendChild(doc.createTextNode(css));
        head.appendChild(style);
    }
</script>

@code {
    private string EditorValue { get; set; } = "<p>The default font-size is 24px.</p>";

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender)
        {
            await js.InvokeVoidAsync("injectEditorStyleTag");
        }
    }
}

Currently, on small devices the Editor tools are wrapped on multiple lines. I'd like to have the tools displayed in a separate menu when they do not fit on a single row.

For example:

I bind the TelerikEditor Value to a property that is reloaded with different unrelated content. The editor keeps the Undo/Redo stack so for the "second" content I can Undo back to the "first" content. I'd like to be able to clear the Undo stack.

Steps to reproduce:

https://demos.telerik.com/blazor-ui/editor/overview

1. Clean content
2. Insert sentence
3. Center it and press Enter
4. Type new sentence and select whole content (Ctrl + A)
5. Align not possible, because is selected

Expected: All paragraphs in the editors receive center alignment

Actual: Align is possible

A functionality similar to "TelerikUpload" (i.e. browse/select image file) would be useful when trying to insert an image

Drag to resize and move images in the editor

Similar to https://demos.telerik.com/kendo-ui/editor/index