problem deleting text in the design window when "real-time html view" is enabled

[Trevor]

The behavior can be seen on the Telerik demo page:  http://demos.telerik.com/aspnet-ajax/editor/examples/default/defaultcs.aspx

1. Enable 'Real-Time HTML View' module,
2. highlight a word in the Design window,
3. delete the highlighted word
4. wait a second or two...
...the deleted word reappears.


If after step 3 I quickly click elsewhere in the design window, the deleted word does not reappear.

Can you provide a solution to this problem?

Thanks.

[Rumen]

Hello,

I am aware of this problem and it a side effect of the Real Time HTML View module. To not decrease performance when editing large content, the content displayed inside this module is updated not on key press but after small delay of time. When the update is executed the module takes the focus which is causing the problem.

You can try the following workaround:

<telerik:RadEditor ID="RadEditor1" runat="server">
    <Content>test test RadEditor test test</Content>
    <Modules>
        <telerik:EditorModule Name="RadEditorHtmlInspector" />
    </Modules>
</telerik:RadEditor>
    <script type="text/javascript">
    Telerik.Web.UI.Editor.Modules.RadEditorHtmlInspector.prototype.render = function () {
        Telerik.Web.UI.Editor.Modules.RadEditorHtmlInspector.callBaseMethod(this, 'render');

        var txtArea = document.createElement("textarea");
        txtArea.style.width = "99%";
        txtArea.className = "reTextarea";
        txtArea.setAttribute("rows", "10");
        txtArea.setAttribute("cols", "80");
        this._textarea = txtArea;

        //In IE if scrollbar styles are specified, can cause IE to crash. Do not set css styles for TEXTAREA scrollbars!
        //Not able to type in textarea under Mozilla. Fixed by calling focus explicitly!
        if (!this.isIE) txtArea.onclick = new Function("this.focus();");

        var root = this.get_element();
        root.appendChild(txtArea);

        this.get_editor().add_selectionChange(this._onSelectionChangedDelegate);
        this.get_editor().attachEventHandler("onkeypress", this._onSelectionChangedDelegate);
        this.get_editor().attachEventHandler("onkeydown", this._onSelectionChangedDelegate);
        this.get_editor().attachEventHandler("onkeyup", this._onSelectionChangedDelegate);

    }
</script>

Kind regards,
Rumen
the Telerik team

[Trevor]

This workaround has solved the problem. Thanks,