This is a migrated thread and some comments may be shown as answers.

RadEditor in Sitecore - pasteHtml changing the html

5 Answers 381 Views
Editor
This is a migrated thread and some comments may be shown as answers.
Maciej
Top achievements
Rank 1
Maciej asked on 31 Jan 2019, 08:56 AM

We have been trying to extend the Rich Text Editor built into Sitecore 9, but have encountered a problem with the pasteHtml method. Trying to insert this snippet:

<blockquote>
    <p>Quote Text</p>
</blockquote>
<cite>Quote Author</cite>

results in:

<p>Quote Text</p>
<blockquote></blockquote><cite>Quote Author</cite>

Is there anything that can be done to fix this behaviour?

5 Answers, 1 is accepted

Sort by
0
Rumen
Telerik team
answered on 31 Jan 2019, 10:16 AM
Hello Maciej,

I tried to reproduce the reported issue with default configuration of the latest version of the control, but without success.

You can see my test in the attached video recorded in Edge, Chrome and Firefox (latest versions).

I also attached my project so that you can test on your side.

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.
0
Maciej
Top achievements
Rank 1
answered on 31 Jan 2019, 10:33 AM

Hi Ruben,

Thanks for the quick reply. As far as I know, Sitecore uses version 2017.2.711. I have investigated the issue and found that the markup is first inserted just fine, but later modified during calls to applyFix(...), _fixNestedParagraphs(...) and _unwrapElement(...) functions. Is there any way to alter this behaviour?

0
Rumen
Telerik team
answered on 04 Feb 2019, 09:43 AM
HI Maciej,

You can disable the ConvertToXhtml filter which should solve the problem in the older version:

RadEditor1.DisableFilter(Telerik.Web.UI.EditorFilters.ConvertToXhtml);

You can also disable it through the ContentFilters property.


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.
0
Maciej
Top achievements
Rank 1
answered on 04 Feb 2019, 01:38 PM
Hi Rumen,
Thanks for the reply. Unfortunately, disabling the filter did not solve the issue.

Kind Regards,
Maciej
0
Rumen
Telerik team
answered on 04 Feb 2019, 03:09 PM
Hi Maciej,

In this case, I can see two different approaches:
  • contact Sitecore support and ask them how you can upgrade the Telerik.Web.UI.dll to the latest version in their CMS system - this is the recommended approach since we can implement fixes for the upcoming versions only. Please check out this article: Bug Fixes.
  • or override the applyFix or _fixNestedParagraphs functions on your own and resolve the issue in the older version:


    <script>
        var BLOCK_ELEMENTS = "div,table,ol,ul,h1,h2,h3,h4,h5,h6,hr";
        var PARAGRAPH = "p";
        var ANCHOR = "a";
        var browser = Telerik.Web.Browser;
        var $T = Telerik.Web.UI;
        var $E = $T.Editor;
     
        $E.NestedElementsFix.prototype.applyFix = function (elements) {
            alert(1)
            var that = this;
     
            that.blockElements = elements || that.getBlockElements();
     
            // for example comment out some of the functions
            //that._fixNestedParagraphs();
            //that._unwrapBlockElements();
        }
     
        //or override the functionality inside the _fixNestedParagraphs one
        $E.NestedElementsFix.prototype._fixNestedParagraphs = function () {
            var context = this.context;
            var paragraphs = null;
            if (utils.isEditorContentArea(context)) {
                paragraphs = context.getElementsByTagName(PARAGRAPH);
            }
            else {
                var parentBlockElement = this._getParentBlockElement(context);
                if (utils.isTag(parentBlockElement, PARAGRAPH)) {
                    paragraphs = [parentBlockElement];
                }
            }
     
            if (!paragraphs) {
                return;
            }
     
            for (var i = paragraphs.length - 1; i >= 0; i--) {
                var parentParagraph = paragraphs[i],
                    $childParagraphs = this._getParagraphs(parentParagraph);
                for (var j = $childParagraphs.length - 1; j >= 0; j--) {
                    this._unwrapElement($childParagraphs[j], parentParagraph);
                }
                if ($childParagraphs.length && utils.isNodeEmptyRecursive(parentParagraph)) {
                    this._removeBlockElement(parentParagraph);
                }
            }
        }
    </script>
    <telerik:RadEditor ID="RadEditor1" runat="server">
        <Content>
            <blockquote>
                <p>Quote Text</p>
            </blockquote>
            <cite>Quote Author</cite>
        </Content>
    </telerik:RadEditor>


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.
Tags
Editor
Asked by
Maciej
Top achievements
Rank 1
Answers by
Rumen
Telerik team
Maciej
Top achievements
Rank 1
Share this question
or