Auto scrolling to top of RadEditor on Paste...

[Bradley]

When using the pasting functionality via ctrl-v or right-click then clicking paste menu, on a RadEditor content area that has enough content to require it to scroll down in the actual edit, after the paste is done, the RadEditor is automatically scrolled up to the top of the content area of the RadEditor.  I am using the Telerik.Web.UI version 2013.1.220.40, Telerik RadControls for ASP.NET Ajax in Chrome, version Version 61.0.3163.100 (Official Build) (64-bit), as all our users are required to do so.  This was not always occurrring but seemed to start a couple of months ago, or less.  This issue, however, does not occur in IE or Firefox.

Below is a video showing a replication of the issue.  In the code it seems that none of the copied text is going into the radePasteHelper and then the following code in Telerik.Web.UI.WebResource.axd is ending putting the focus in the wrong area:

m.innerHTML = " ";
                            e = this.getSelection();
                            l = this.get_document().createRange();
                            l.setStart(m.firstChild, 0);
                            l.setEnd(m.firstChild, 1);
                            e.selectRange(l);

I understand this is a legacy version of the Telerik control, but need to get this fixed ASAP while we work on the possibility of implementing a newer version.

https://youtu.be/yBsHoJ6zxA0

 

[Rumen]

Hello,

You ca try to:
- set the StripFormattingOptions property to "NoneSupressCleanMessage"
- set the ContentAreaMode to div
- Or upgrade to the latest version 2017.3.913 (recommended) since this is the only version to provide support for the latest versions of the modern browsers.

Best regards,
Rumen
Progress Telerik

[Bradley]

Thanks.  It does look like the " set the ContentAreaMode to div" option does work, however reformats the text.

Yes, upgrading is the best option which is being considered, however in the meantime, a temporary "fix" has been implemented with the following code which it scrolls back to relatively the same location as the original paste:

Adding the following to the control, server side:

OnClientSelectionChange="radEditorControl_OnClientSelectionChange"         OnClientPasteHtml="radEditorControl_OnClientPasteHtml" />

 

Client side, the following was added:

var inputEditorRange, inputEditor;
function radEditorControl_OnClientLoad(editor, args) {
        //Added due to auto scroll issue on paste
    if (inputEditor == null)
        inputEditor = editor;

    //Added so user doesn't have to scroll down after the "paste dialog" is displayed the first time.
    editor.fire("PastePlainText");
    editor.get_dialogOpener()._dialogContainers.CleanPasteTextContent.close();
}

function radEditorControl_OnClientSelectionChange() {
    var selection = inputEditor.getSelection();
    inputEditorRange = selection.getRange(true);
}

function radEditorControl_OnClientPasteHtml() {
    var offsetTop = inputEditorRange.commonAncestorContainer.parentElement.offsetTop;
    inputEditor.get_contentAreaElement().contentWindow.scrollTo(0, offsetTop);
}

[Rumen]

I've updated your Telerik points for that you shared your solution with the community.

As to the div content area styling issue, the div is part of the same page (the iframe is another document) so the formatting is directly applied to the DIV. If you have global CSS styles you have to rewrite them. You can find more information in the following demo: http://demos.telerik.com/aspnet-ajax/editor/examples/settingcontentareadefaults/defaultcs.aspx.

Regards,
Rumen
Progress Telerik

[Bradley]

Thanks again for that information as I'll take changing the ContentAreaMode to "DIV" and changing the global css as a possible option to our upgrading the control.