Completed
Last Updated: 18 Apr 2019 11:21 by ADMIN
Rajiv
Created on: 17 Apr 2019 15:16
Category: Editor
Type: Bug Report
0
The DOM Inspector module does not completely remove the STYLE tag contents
Code snippets coming after remove table style from insert table popup in chrome,ie,ff.

I am facing a big problem in editor please give any solution.

Link: https://demos.telerik.com/aspnet-ajax/editor/examples/overview/defaultcs.aspx

Steps to reproduce

Step 1

Try to insert table from Insert Table from editor toolbar.

Step 2

Right click on cell then click on Table/cell properties. A table wizard popup will come.

Step 3

Click on Table Layouts tab on the table wizard popup.

Step 4

Select any value from table styles drop down.

Step 5

Now you can see  TABLE>TR>TD>RemoveElement on the bottom of the editor.click on RemoveElement .

After click on RemoveElement you can see STYLE>RemoveElement  again click on RemoveElement.

then you can see like below in the editor.

.telerik-reTable-2 { border-collapse: collapse; border: solid 0px; font-family: Tahoma; } .telerik-reTable-2 tr.telerik-reTableHeaderRow-2 { border-width: 1.0pt 1.0pt 3.0pt 1.0pt...........
Attached Files:
2 comments
ADMIN
Rumen
Posted on: 18 Apr 2019 11:21
Hi All,

The problem will be officially resolved in R2 2019, due in mid-May.

Best 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.
ADMIN
Rumen
Posted on: 17 Apr 2019 15:34
Hi Rajiv,

Thank you for pointing out this issue.

You can fix it using the following override:


<script>
    var $T = Telerik.Web.UI;
    var utils = $T.Editor.Utils;
    var isTag = utils.isTag;
    var dom = Sys.UI.DomElement;
    var addClass = dom.addCssClass;
    var removeClass = dom.removeCssClass;
    var hasClass = dom.containsCssClass;
    var $EditorModules = $T.Editor.Modules;
 
    $EditorModules.RadEditorDomInspector.prototype.removeSelectedElement = function(elem) {
        var editor = this.get_editor();
        var tag = function (name) { return isTag(elem, name); };
        var cmd;
 
        try {
            if (tag("TD") || tag("TH")) {
                editor.fire("DeleteCell");
            }
            else if (tag("TR")) {
                var cells = elem.getElementsByTagName("td");
                if (cells.length) {
                    this.selectElement(cells[0]);
                    editor.fire("DeleteRow");
                }
            }
            else if (tag("TABLE") || tag("TBODY") || tag("THEAD") || tag("TFOOT") ||
                tag("EMBED") || tag("OBJECT") ||
                tag("INPUT") ||
                tag("IMG") ||
                tag("HR") ||
                tag("STYLE")) {
                cmd = new Telerik.Web.UI.Editor.GenericCommand(this._removeElementString, editor.get_contentWindow(), editor);
                window.setTimeout(function () {
                    elem.parentNode.removeChild(elem);
                    editor.setFocus();
                    editor.executeCommand(cmd);
                    editor.raiseEvent("selectionChange");
                }, 0);
            }
            else if (elem !== editor.get_contentArea()) {
                cmd = new Telerik.Web.UI.Editor.GenericCommand(this._removeElementString, editor.get_contentWindow(), editor);
                Telerik.Web.UI.Editor.Utils.removeNode(elem);
                editor.setFocus();
                editor.executeCommand(cmd);
            }
        }
        catch (ex) { }
 
        editor.raiseEvent("selectionChange");
    }
</script>
<telerik:RadEditor ID="RadEditor1" runat="server"></telerik:RadEditor>

Please let me know how the fix works on your side and is there any issues or side effects after applying it.

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.