RadEditor Text and Content always empty

[jeslopmay]

Hello,

I come across a problem, which may be just silly, but I can not find the reason. I would appreciate to help me.

I created a WebUserControl containing three RadEditor, each for a different type of text (short text, medium text and large text). Through Javascript I check the maximum number of characters for the short and medium text (this works well):

<script type="text/javascript">
    var maxTextLength = 100;
    var maxTextLengthM = 250;
    var messageText = 'Ha superado el máximo permitido de ' + maxTextLength + ' caracteres para el Texto Corto!';
    var messageTextM = 'Ha superado el máximo permitido de ' + maxTextLengthM + ' caracteres para el Texto Medio!';

    function isAlphaNumericKey(keyCode) {
        if ((keyCode > 47 && keyCode < 58) || (keyCode > 64 && keyCode < 91)) {
            return true;
        }
        return false;
    }

    function LimitCharacters(editor) {
        editor.attachEventHandler("keydown", function (e) {
            e = (e == null) ? window.event : e;
            if (isAlphaNumericKey(e.keyCode)) {
                textLength = editor.get_text().length;
                if (textLength >= maxTextLength) {
                    alert(messageText);
                    e.returnValue = false;
                    return false;
                }
            }
        });
    }

    function LimitCharactersM(editor) {
        editor.attachEventHandler("keydown", function (e) {
            e = (e == null) ? window.event : e;
            if (isAlphaNumericKey(e.keyCode)) {
                textLength = editor.get_text().length;
                if (textLength >= maxTextLengthM) {
                    alert(messageTextM);
                    e.returnValue = false;
                    return false;
                }
            }
        });
    }

    function CalculateLength(editor, value) {
        var textLength = editor.get_text().length;
        var clipboardLength = value.length;
        textLength += clipboardLength;
        return textLength;
    }

    function OnClientPasteHtml(editor, args) {
        var commandName = args.get_commandName();
        var value = args.get_value();
        if (commandName == "PasteFromWord"
            || commandName == "PasteFromWordNoFontsNoSizes"
            || commandName == "PastePlainText"
            || commandName == "PasteAsHtml"
            || commandName == "Paste") {
            var textLength = CalculateLength(editor, value);
            if (textLength >= maxTextLength) {
                alert(messageText);
                args.set_cancel(true);
            }
        }
    }

    function OnClientPasteHtmlM(editor, args) {
        var commandName = args.get_commandName();
        var value = args.get_value();
        if (commandName == "PasteFromWord"
            || commandName == "PasteFromWordNoFontsNoSizes"
            || commandName == "PastePlainText"
            || commandName == "PasteAsHtml"
            || commandName == "Paste") {
            var textLength = CalculateLength(editor, value);
            if (textLength >= maxTextLengthM) {
                alert(messageTextM);
                args.set_cancel(true);
            }
        }
    }
</script>




<table style="width:500px; border:none;">
    <tr>
        <td style="text-align:center; font-weight:bold; text-align:center;">Texto Corto
        </td>
    </tr>
    <tr>
        <td style="vertical-align:top;">
                    <telerik:RadEditor Language="es-ES" LocalizationPath="~/App_GlobalResources/" id="txtTextoCorto" runat="server" SkinID="DefaultSetOfTools" EditModes="Design"
                        Skin="Sunset" ToolsFile="~/EditorOpcionesBasicas.xml" OnClientLoad="LimitCharacters" OnClientPasteHtml="OnClientPasteHtml" Height="120">
                    </telerik:RadEditor>
        </td>
    </tr>
    <tr><td style="height:30px;"></td></tr>
    <tr>
        <td style="text-align:center; font-weight:bold; text-align:center;">Texto Medio</td>
    </tr>
    <tr>
        <td style="vertical-align:top;">

                    <telerik:RadEditor Language="es-ES" LocalizationPath="~/App_GlobalResources/" id="txtTextoMedio" runat="server" SkinID="DefaultSetOfTools" EditModes="Design"
                        Skin="Sunset" ToolsFile="~/EditorOpcionesBasicas.xml" OnClientLoad="LimitCharactersM" OnClientPasteHtml="OnClientPasteHtmlM" Height="190">
                    </telerik:RadEditor>

        </td>
    </tr>
    <tr><td style="height:30px;"></td></tr>
    <tr>
        <td style="text-align:center; font-weight:bold; text-align:center;">Texto Largo</td>
    </tr>
    <tr>
        <td style="vertical-align:top;">
            <telerik:RadEditor Language="es-ES" LocalizationPath="~/App_GlobalResources/" id="txtTextoLargo" runat="server" SkinID="DefaultSetOfTools" EditModes="Design"
                Skin="Sunset" ToolsFile="~/EditorOpcionesBasicas.xml" Height="300">
            </telerik:RadEditor>
        </td>
    </tr>
</table>

This WebUserControl contains a function that saves the text to a database:

public bool GuardarTextos(string pIdACP, out string pError)
        {
            pError = "";
            return mLN.GuardarTextosACP(pIdACP, txtTextoCorto.Content.Trim(), txtTextoMedio.Content.Trim(), txtTextoLargo.Content.Trim(), out pError);
        }

Here, for all the RadEditors (txtTextoCorto, txtTextoMedio and txtTextoLargo) always the Content property and Text property is empty.

I show the WebUserControl in an asp ModalPopupExtender and I call the GuardarTextos function from an external button.

Can you help me what I'm doing wrong?

Thank you very much.

[Ivaylo]

Hello Jesus,

I have just answered your support ticket on the subject, but for convenience I will also place my response here:

I tried to reproduce the issue you are experiencing, but to no avail. I have used your code to prepare a sample page with a user control, holding the three editors as you have explained, which runs without any issues on my side. I have executed the tests using controls as of 2013 Q1 and IE9, as specified in the ticket info. If those are not the same in your scenario and the problem persists, could you provide us with additional information regarding your browser, its version, and the control's version you are using?

As for the sample project I have attached, with the press of the Print button the code prints the content of the Editors both in the user control page and in the parent page and the printed values always reflect the Editor's true content. The only change that I have made is that I have replaced the GuardarTextos() function for better readability of the example.

Could you please make sure that you are not executing a PostBack to the server before saving the content in the database, which would cause the Editor's Content Area to be cleared?

If the problem persists, could you please provide us with a simple fully runnable project reproducing it, so that we can isolate the issue and perform further investigation.

Regards,
Ivaylo
Telerik

[jeslopmay]

Hello Ivaylo!

I appreciate your answer in my ticket and here in the forum, so we can help those who are in muy same situation - if anyone, of course ;o) -

I answered to my ticket and do so here:

My scenario is a little bit different. I attach a test proyect where you can see my issue.

As a summary of my scenario:

- I don't show the ModalPopupExtender from the TargetControlID property because I have to load text in the TelerikRadEditor if exist in database

- I found that the second time I show the TelerikRadEditor within the WebUserControl and get the text again, I obtain the first text that I typed. (In the attached proyect you can find the steps to reproduce this case)

Thank you again for your help!

Note: If it sees fit, you can post here the attachment I added to my ticket. I can't do it because the allowed size is 2Mb and the allowed extensions are not .zip

Thank you so much!

[Ivaylo]

Hello Jesus,

Thank you for your feedback.

I have already replied to your support ticket. I am also placing a copy of my response here for those people who might be experiencing the same issue.

We examined the project and reproduced the issue on our machines, as well. It is caused by a known issue with RadEditor when using UpdatePanels, as is this particular case. The reason is a problem in the MS AJAX implementation under specific browsers, as explained in greater depth in: RadEditor Content Not Saved After Ajax Update.

There is currently one workaround that I can suggest, which is also described in the article I have referenced above. In order to avoid the issue, the UseSubmitBehavior property of the button responsible for the AJAX Request to the server (btnOK in the sample project) needs to be set to false. Below you can find an example of how the control's declaration should look like after the change.

<telerik:RadButton ID="btnOK" UseSubmitBehavior="false" runat="server" Text="Ok" onclick="btnOK_Click"></telerik:RadButton>

Regards,
Ivaylo
Telerik

[jeslopmay]

Hi Ivaylo,

Your solution is perfect for my issue.

Once again, thank you very much for your help and congratulations for the great job by Telerik Team Support.

[Shraddha]

In our code we are using RadToolBar and RadMultipageView Combination.In on of the tab content we have used Rad Editor as shown in below Code.
    <telerik:RadEditor
    SkinID="RichTextbox"
    Height="200px"
    ID="Rtb" Width="80%" runat="server" />
Every time on tab click; postback happens; Issue we are facing is Rad Editor is not able to maintain its style.Its distorting and
in case of SkinID="RichTextbox"; its disappearing.Also due to this some of the Telerik controls are failing(for .e.g Calender control)

[Marin Bratanov]

Hello Shraddha,

Does this issue happen only with IE? If so, it is possible that for a complex page it has reached its stylesheet limit. You can read more about this issue and a possible workaround (adding a RadStyleSheetManager to the page) here: http://blogs.telerik.com/aspnet-ajax/Posts/10-05-03/internet-explorer-css-limits.aspx.

Another possible reason for a similar problems is a JavaScript error. I advise that you examine the browser console and try to resolve any errors present. An error can also be thrown because some resources are not properly loaded, so you can check for this as well.

Also, if removing the SkinID property resolves the problem, I advise that you remove bits from the Theme until you can see which is the problematic properly that comes from the SkinID that causes the problem.


Regards,

Marin Bratanov
Telerik