We have a survey page that has multiple editor fields in it. They need to accept rich text from a paste or other keyboard commands, but we do not want to waste the vertical space for the toolbar appearing in each editor field.
Please update the editor to hide the toolbar if the List<IEditorTool> collection is empty.
This change would make it much easier and less fragile than removing the toolbar to through Css.
Hello Wes,
I confirm that so far nobody has expressed interest in this feature. Our reasoning to decline is available in my previous reply. However, if customer demand suddenly appears or the votes for this item increase, we can reconsider.
Regards,
Dimo
Progress Telerik
Thank you for the response and suggestion. I came to the same basic workaround, though I targeted the .k-editor-toolbar class.
This is for an internal survey form and rich formatting doesn't provide any business value. We don't want to advertise the rich text formatting as it is not needed, but we do want to keep formatting for pasted text and allow pasted images.
In my opinion, having the toolbar hidden when there are no tools seems like a logical behavior. Is it possible to collect user feedback before declining, to see if anyone else is interested, even if they didn't bother to ask?
In the meantime, I'll wrap a custom component around the telerik editor to provide the behavior I want.
Thanks again.
Wes
Hello Wes,
Using an Editor without any tools is extremely rare. I think you are the first customer with such a scenario.
A WYSIWYG Editor without visible tools does not provide good UX. The Editor looks like a TextArea and users are not aware of all available text formatting capabilities.
As a result, we believe that this feature request is more suitable for a workaround, rather than built-in functionality. Here is a suggestion that is reliable and will work with multiple Editors on the same page:
@using Telerik.Blazor.Components.Editor
<TelerikButton OnClick="@OnButtonClick">Toggle Tools Collection</TelerikButton>
<TelerikEditor Tools="@EditorTools"
Height="300px"
@bind-Value="@EditorValue"
Class="@( !EditorTools.Any() ? "no-tools" : string.Empty )">
</TelerikEditor>
<style>
.no-tools .k-toolbar {
display: none;
}
</style>
@code {
private string EditorValue { get; set; } = @"<p>foo</p><p>bar</p>";
private List<IEditorTool> EditorTools { get; set; } = EditorToolSets.Default;
private void OnButtonClick()
{
EditorTools = EditorTools.Any() ? new List<IEditorTool>() : EditorToolSets.Default;
}
}
Regards,
Dimo
Progress Telerik