If you have multiple RadEditor controls on a page in Lightweight Render mode, changing forground or background colour on one, changes the toolbar on the others

Progress® Telerik® UI for ASP.NET AJAX Feedback Portal

Create an account Log In

Back to Feed

Request a Feature Report a Bug

Completed

Last Updated: 17 May 2021 12:53 by ADMIN

Justin Mellor

Created on: 25 Nov 2019 13:35

Category: Editor

Type: Bug Report

If you have multiple RadEditor controls on a page in Lightweight Render mode, changing forground or background colour on one, changes the toolbar on the others

If you setup multiple RadEditor controls on a single page with RenderMode set to Lightweight then when you change the foreground or background colour on one control, the other controls update their toolbar at the same time.

Sample Page code

    <h1>Editor 1</h1>
    <telerik:RadEditor ID="editor1" runat="server" RenderMode="Lightweight"></telerik:RadEditor>

    <h1>Editor 2</h1>
    <telerik:RadEditor ID="editor2" runat="server" RenderMode="Lightweight"></telerik:RadEditor>

2 comments

ADMIN

Rumen

Posted on: 17 May 2021 12:52

Hi everyone,

A workaround that you can use for the issue is:

<telerik:RadEditor ID="editor2" runat="server" RenderMode="Lightweight"></telerik:RadEditor>
<script type="text/javascript">
    if (typeof (Telerik.Web.UI.Editor) != "undefined") { 
        var $ = $telerik.$;
        Telerik.Web.UI.Editor.UI.LightweightColorPickerView.prototype.decorate = function (color) {
                var editorId = this.owner.get_parent().get_editor().get_id();
                var styleEl = $("head").find("style#re" + this.owner.get_name() + "_" + editorId + "_StyleHolder");
                if (!styleEl.get(0)) {
                    styleEl = $("<style></style>").attr("id", "re" + this.owner.get_name() + "_" + editorId + "_StyleHolder");
                    $("head").append(styleEl);
                }
                var content = "";
                if (color) {
                    content = "#" + editorId + " a.reToolIcon.reTool.re" + this.owner.get_name() + ":before{color:" + color + ";}";
                }

                try { //IE8 throws an error when setting innerHTML to a <style> element
                    styleEl.text(content);
                }
                catch (e) {
                    styleEl.prop("styleSheet").cssText = content;
                }
            }
    }
</script>

Regards,
Rumen
Progress Telerik

Тhe web is about to get a bit better!

The Progress Hack-For-Good Challenge has started. Learn how to enter and make the web a worthier place: https://progress-worthyweb.devpost.com.

ADMIN

Rumen

Posted on: 25 Nov 2019 13:49

Updated on 11 Feb 2020: Shortly before the R1 2020 release, we found out that the hotfix introduces a regression and we did not check it in. We will try to incorporate it into a future release.

End of Update

Hi Justin,

Thank you for reporting this glitch!

I do appreciate your feedback and have good news that we managed to fix it. The problem will not exist in the upcoming R1 release, expected in mid-January 2020.

As a small note of gratitude, I also updated your Telerik points.

Regards,
Rumen
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.