I cant Insert <button> to HtmlEditor #1124

New Issue

claunia · 2026-01-29T17:49:14Z

claunia commented

2026-01-29 17:49:14 +00:00

Originally created by @sysdevcom on GitHub (Feb 8, 2024).

I am trying to create a custom tool to insert buttons. But no buttons are inserted at all.

<RadzenHtmlEditor @bind-Value=@htmlValue style="height: 600px;" UploadUrl="upload/image" Execute=@OnExecute>
    <RadzenHtmlEditorCustomTool CommandName="InsertButton" Icon="add_box" Title="InsertButton" />
</RadzenHtmlEditor>

@code {
    private async Task OnExecute(HtmlEditorExecuteEventArgs args)
    {
        switch (args.CommandName)
        {
            case "......":
            case "InsertButton":
                await args.Editor.SaveSelectionAsync();
                await DialogService.OpenAsync("select file", ... , null);
                await args.Editor.FocusAsync();
                await args.Editor.RestoreSelectionAsync();
                await args.Editor.ExecuteCommandAsync(HtmlEditorCommands.InsertHtml, $"<button>{file}</button>");
                break;
        }
    }
}

Originally created by @sysdevcom on GitHub (Feb 8, 2024). I am trying to create a custom tool to insert buttons. But no buttons are inserted at all. ``` <RadzenHtmlEditor @bind-Value=@htmlValue style="height: 600px;" UploadUrl="upload/image" Execute=@OnExecute> <RadzenHtmlEditorCustomTool CommandName="InsertButton" Icon="add_box" Title="InsertButton" /> </RadzenHtmlEditor> @code { private async Task OnExecute(HtmlEditorExecuteEventArgs args) { switch (args.CommandName) { case "......": case "InsertButton": await args.Editor.SaveSelectionAsync(); await DialogService.OpenAsync("select file", ... , null); await args.Editor.FocusAsync(); await args.Editor.RestoreSelectionAsync(); await args.Editor.ExecuteCommandAsync(HtmlEditorCommands.InsertHtml, $"<button>{file}</button>"); break; } } } ```

claunia closed this issue

2026-01-29 17:49:14 +00:00

claunia commented

2026-01-29 17:49:14 +00:00

@akorchev commented on GitHub (Feb 8, 2024):

I've customized our online demo and it seems to work as expected.

@akorchev commented on GitHub (Feb 8, 2024): I've customized our [online demo](https://blazor.radzen.com/html-editor-custom-tools#command-dialog) and it seems to work as expected. ![insert-button](https://github.com/radzenhq/radzen-blazor/assets/454726/58be10e9-b1c2-450d-b3b3-ed2fe46cbcfc)

claunia commented

2026-01-29 17:49:15 +00:00

@sysdevcom commented on GitHub (Feb 9, 2024):

Oh, a button could be inserted.
The button I was actually trying to insert was the following button.
$"<button class='btn btn-outline-dark' onclick='download(\"{file}\")>download</button>"
This was not inserted even in the online demo.

Then I realised that the ' at the end of the onclick was missing !

Sorry, it was a simple mistake on my part.

And thanks for the nice component.

@sysdevcom commented on GitHub (Feb 9, 2024): Oh, a button could be inserted. The button I was actually trying to insert was the following button. `$"<button class='btn btn-outline-dark' onclick='download(\"{file}\")>download</button>"` This was not inserted even in the online demo. Then I realised that the `'` at the end of the onclick was missing ! Sorry, it was a simple mistake on my part. And thanks for the nice component.

claunia referenced this issue

2026-01-29 18:19:16 +00:00

[PR #1124] [CLOSED] Add ItemSelected in AutoComplete #2529

claunia referenced this issue

2026-01-29 18:19:17 +00:00

[PR #1124] Add ItemSelected in AutoComplete #2532

Sign in to join this conversation.