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

RadEditor not in AJAX request being updated

7 Answers 106 Views

Ajax

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

Andy Green asked on 14 Nov 2013, 08:10 AM

I have a RadEditor, a few buttons, and a checkboxlist on a page.

When the buttons are clicked the checkboxlists are being updated with AJAX, this works fine.

But... the RadEditor content is being cleared. It looks like its being reloaded. There is a textbox on the page and the content of this control is retained. The RadEditor is not in the AJAX settings.

This is my page code:

<%@ Page Title="" Language="VB" MasterPageFile="~/MasterPages/Display2.master" AutoEventWireup="false" CodeFile="Mailshot.aspx.vb" Inherits="Admin_Mailshot" MaintainScrollPositionOnPostback="false"%>

<%@ Register src="../Controls/AdminMenu.ascx" tagname="AdminMenu" tagprefix="uc1" %>

<asp:Content ID="Content1" ContentPlaceHolderID="cphLeft" Runat="Server">

<telerik:RadAjaxLoadingPanel ID="LoadingPanel" runat="Server" BackgroundPosition="Center" BackgroundTransparency="50"><img alt="Loading..." src="../App_Themes/Images/ajax-loader.gif"/></telerik:RadAjaxLoadingPanel>

<asp:HiddenField ID="hdnCommitte" runat="server" />

<telerik:RadAjaxManager ID="AjaxManager" runat="server" UpdatePanelsRenderMode="Inline">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="btnSend">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="lblHeading" LoadingPanelID="LoadingPanel"/>

<telerik:AjaxUpdatedControl ControlID="pnlMailShot" LoadingPanelID="LoadingPanel" />

<telerik:AjaxUpdatedControl ControlID="pnlReceipt" LoadingPanelID="LoadingPanel" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="btnSelectAll">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="clbMembers" UpdatePanelCssClass="" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="btnSelectCommittee">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="clbMembers" UpdatePanelCssClass="" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="btnSelectClear">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="clbMembers" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<div class="left">

<div class="content">

<h1><asp:Label id="lblHeading" runat="server" Text="Mailshot"></asp:Label></h1>

<asp:Panel id="pnlMailShot" runat="server">

<table width="100%" cellpadding="2" cellspacing="0">

<tr>

<td>

<table width="100%" cellpadding="4" cellspacing="0">

<tr>

<td>Subject:</td>

<td>

<asp:TextBox ID="txtSubject" runat="server" CssClass="TextBoxDecorator" Width="280px"></asp:TextBox>

<asp:RequiredFieldValidator ID="rfvSubject" runat="server" ControlToValidate="txtSubject" ><img src="../App_Themes/Images/Missing_10.gif" alt="Missing Field"/></asp:RequiredFieldValidator>

</td>

<td rowspan="2">

<telerik:RadButton ID="btnSend" Text="Send" runat="server" EnableEmbeddedSkins="true" Skin="Sunset">

<Icon PrimaryIconUrl="../App_Themes/Images/Refresh_16.png"/>

</telerik:RadButton>

<telerik:RadButton ID="btnClear" Text="Clear" runat="server" EnableEmbeddedSkins="true" Skin="Sunset" CausesValidation="false">

<Icon PrimaryIconUrl="../App_Themes/Images/Refresh_16.png"/>

</telerik:RadButton>

</td>

</tr>

<tr>

<td>From:</td>

<td><asp:Label id="lblFrom" runat="server"></asp:Label></td>

</tr>

</table>

</td>

</tr>

<tr>

<td>

<telerik:RadEditor ID="rteMailshot" runat="server" EditModes="All" Height="250px" ToolsFile="~/ToolsFile.xml" Skin="Office2010Blue" Width="99.7%" CssClass="editor" ToolTip="" AutoResizeHeight="true">

<Content></Content>

<CssFiles>

<telerik:EditorCssFile Value="~/App_Themes/Default/Editor.css" />

</CssFiles>

<Languages>

<telerik:SpellCheckerLanguage Code="en-GB"/>

</Languages>

<SpellCheckSettings DictionaryLanguage="en-GB" />

</telerik:RadEditor>

</td>

</tr>

</table>

<br />

<div style="padding-left:5px;">

<telerik:RadButton ID="btnSelectAll" Text="Select All" runat="server" EnableEmbeddedSkins="true" Skin="Sunset" CausesValidation="false">

<Icon PrimaryIconUrl="../App_Themes/Images/Refresh_16.png"/>

</telerik:RadButton>

<telerik:RadButton ID="btnSelectCommittee" Text="Select Committee" runat="server" EnableEmbeddedSkins="true" Skin="Sunset" CausesValidation="false">

<Icon PrimaryIconUrl="../App_Themes/Images/Refresh_16.png"/>

</telerik:RadButton>

<telerik:RadButton ID="btnSelectClear" Text="Clear" runat="server" EnableEmbeddedSkins="true" Skin="Sunset" CausesValidation="false">

<Icon PrimaryIconUrl="../App_Themes/Images/Refresh_16.png"/>

</telerik:RadButton>

</div>

<asp:CheckBoxList id="clbMembers" runat="server" RepeatColumns="5" RepeatDirection="Vertical" CellPadding="6" ClientIDMode="Static"></asp:CheckBoxList>

</asp:Panel>

<asp:Panel id="pnlReceipt" runat="server" Visible="false">

<p>The following mailshot was sent to <asp:Label ID="lblSentCount" runat="server" ></asp:Label></p>

<p><asp:Label ID="lblMailshot" runat="server" ></asp:Label></p>

<asp:Panel ID ="pnlNoEmail" runat="server" >

<h2>Members with no email:</h2>

<asp:CheckBoxList id="clbNoEmail" runat="server" RepeatColumns="5" RepeatDirection="Vertical" CellPadding="6" ClientIDMode="Static" enabled="false"></asp:CheckBoxList>

</asp:Panel>

</div>

</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="cphRight" Runat="Server">

<div class="right">

<div class="content">

<uc1:AdminMenu ID="AdminMenu1" runat="server" selectedItem="Mailshot.aspx" />

</div>

</asp:Content>

Andy

7 Answers, 1 is accepted

answered on 18 Nov 2013, 12:32 PM

Hello Andy,

I have tried to replicate the issue with the disappearing text on my end, but to no avail.

Could you please elaborate about the current RadControls version you are using and on which IE version the issue occurs.

As a side note, please note that in order for the RadAjaxLoadingPanel to work correctly, you need to set its Skin property.

Additionally, please note that since you have wrapping panels as updated controls in your RadAjaxManager and since having nested AJAX setting is not supported scenario which could cause unwanted behavior, please try changing your current RadAjaxManager setting with the following and see if it solves the issue on your end:

<telerik:RadAjaxManager ID="AjaxManager" runat="server" UpdatePanelsRenderMode="Inline" DefaultLoadingPanelID="LoadingPanel">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="pnlMailShot">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="lblHeading" LoadingPanelID="LoadingPanel" />

<telerik:AjaxUpdatedControl ControlID="pnlMailShot" LoadingPanelID="LoadingPanel" />

<telerik:AjaxUpdatedControl ControlID="pnlReceipt" LoadingPanelID="LoadingPanel" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="pnlReceipt">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="lblHeading" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="LoadingPanel" runat="Server" BackgroundPosition="Center"

BackgroundTransparency="50" Skin="Default" MinDisplayTime="300">

</telerik:RadAjaxLoadingPanel>

If the issue persists, please get back to us with the additional information mentioned above.

Regards,
Konstantin Dikov
Telerik

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.

answered on 25 Nov 2013, 08:59 AM

Hi Konstantin

I have tried your approach and its still the same - in fact its not what I need as the Loading panel image is displayed in each panel section not just over the entire page,

I'm using IE 10 (10.0.920.16736 & Tekerik Version=2013.3.1114.40

I have a small video of what is happening, but its not a valid file type. I could email it.

Andy

PS - UPDATE

I have put the code back to my original, and removed the first AJAX section and it works. Or rather the contents dont clear, but the Send button isn't AJAX'd.

<telerik:AjaxSetting AjaxControlID="btnSend">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="lblHeading" LoadingPanelID="LoadingPanel"/>
<telerik:AjaxUpdatedControl ControlID="pnlMailShot" LoadingPanelID="LoadingPanel" />
<telerik:AjaxUpdatedControl ControlID="pnlReceipt" LoadingPanelID="LoadingPanel" />
</UpdatedControls>
</telerik:AjaxSetting>

answered on 25 Nov 2013, 01:54 PM

Hi

If you look at my original post I have a dic containing buttons and a checkboxlist in the same panel as the Rad editor. (pnlMailshot).

I took both of these out of the panel and created a new panel as:

<asp:Panel id="pnlMembers" runat="server">

<div style="padding-left:5px;">

<telerik:RadButton ID="btnSelectAll" Text="Select All" runat="server" EnableEmbeddedSkins="true" Skin="Sunset" CausesValidation="false">

<Icon PrimaryIconUrl="../App_Themes/Images/Refresh_16.png"/>

</telerik:RadButton>

<telerik:RadButton ID="btnSelectCommittee" Text="Select Committee" runat="server" EnableEmbeddedSkins="true" Skin="Sunset" CausesValidation="false">

<Icon PrimaryIconUrl="../App_Themes/Images/Refresh_16.png"/>

</telerik:RadButton>

<telerik:RadButton ID="btnSelectClear" Text="Clear" runat="server" EnableEmbeddedSkins="true" Skin="Sunset" CausesValidation="false">

<Icon PrimaryIconUrl="../App_Themes/Images/Refresh_16.png"/>

</telerik:RadButton>

</div>

<asp:CheckBoxList id="clbMembers" runat="server" RepeatColumns="5" RepeatDirection="Vertical" CellPadding="6" ClientIDMode="Static"></asp:CheckBoxList>

</asp:Panel>

I then had to add the new panel to the update section:

<telerik:AjaxSetting AjaxControlID="btnSend">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="lblHeading" />

<telerik:AjaxUpdatedControl ControlID="pnlMailShot" LoadingPanelID="LoadingPanel" />

<telerik:AjaxUpdatedControl ControlID="pnlMembers" LoadingPanelID="LoadingPanel2"/>

<telerik:AjaxUpdatedControl ControlID="pnlReceipt" LoadingPanelID="LoadingPanel" UpdatePanelCssClass="" />

</UpdatedControls>

</telerik:AjaxSetting>

Because this new panel is now updated separately I had to add a new loading panel one with no uploading image this way I don't get 2 images in different places on the page.

Hope this helps

Andy

answered on 25 Nov 2013, 02:28 PM

Thanks Andy.

I found the solution to my problem somewhere else however, and here it comes for people in the future hitting this post from Google with similar problem :)

I used one of the solutions from here:
http://www.telerik.com/support/kb/aspnet-ajax/editor/radeditor-content-not-saved-after-ajax-update-in-ie9-firefox-google-chrome-and-safari.aspx

In my case, I had some nested panels, so my solution were to set the UseSubmitBehavior="false" on the button which saved the content of the RadEditor.

Hope this helps someone :)