RadEditor in Sitecore - pasteHtml changing the html

[Maciej]

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?

[Rumen]

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

[Maciej]

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?

[Rumen]

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

[Maciej]

Hi Rumen,
Thanks for the reply. Unfortunately, disabling the filter did not solve the issue.

Kind Regards,
Maciej

[Rumen]

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