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

RadEditor MaxHtmlLength RadAjaxLoadingPanel Problem

3 Answers 184 Views

Editor

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

Matthew Ricker asked on 05 Dec 2012, 08:12 PM

Hello,

Here is my setup:

I have a masterpage with a RadAjaxManager on it, and a content page with a RadAjaxManagerProxy on it.

The content page has 2 asp:panels (a master/detail type page) , the detail panel is hidden by default (and contains multiple rad editors)

Selecting a row from panel 1 will show panel 2 using the RadAjaxManagerProxy AjaxSettings.

Panel 2 has some textboxes, and rad editors, and a save and cancel button. I am able to save no problem everything works.

However when using MaxHtmlLength to validate the rad editors, clicking save will show the default Telerik javascript alert() and stop the page from posting, but it doesn't stop the loading panel from displaying. It just spins and wont stop until I refresh or close or whatever. It does not actually post to the server, it just seems to be in limbo land.

Any suggestions?

Thanks!

3 Answers, 1 is accepted

answered on 05 Dec 2012, 08:36 PM

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site1.master.cs" Inherits="RadEditorTest.Site1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

<asp:ContentPlaceHolder ID="head" runat="server">

</asp:ContentPlaceHolder>

<script type="text/javascript">

function MainAjaxManagerOnRequestStart(sender, args) {

if (args.get_eventTarget().indexOf("ExportToExcelButton") >= 0 || args.get_eventTarget().indexOf("ExportToCsvButton") >= 0 || args.get_eventTarget().indexOf("ExportToPdfButton") >= 0 || args.get_eventTarget().indexOf("ExportToWordButton") >= 0)

args.set_enableAjax(false);

}

</script>

</head>

<body>

<form id="form1" runat="server">

<telerik:RadScriptManager ID="MainRadScriptManager" runat="server" />

<telerik:RadStyleSheetManager ID="radstylesheetmanager1" runat="server">

<StyleSheets>

<telerik:StyleSheetReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Skins.Editor.css" />

<telerik:StyleSheetReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Skins.Default.Editor.Default.css" />

<telerik:StyleSheetReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Skins.Window.css" />

<telerik:StyleSheetReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Skins.Default.Window.Default.css" />

</StyleSheets>

</telerik:RadStyleSheetManager>

<telerik:RadAjaxManager ID="MainRadAjaxManager" runat="server" ClientIDMode="Static" DefaultLoadingPanelID="RadAjaxLoadingPanel1" ClientEvents-OnRequestStart="MainAjaxManagerOnRequestStart">

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" />

<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">

</asp:ContentPlaceHolder>

</form>

</body>

</html

>



Content Page




<%@ Page Title="" Language="C#" MasterPageFile="~/Site1.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="RadEditorTest.Default" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
 
<telerik:RadAjaxManagerProxy ID="RadAjaxManagerProxy" runat="server">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="MasterViewPanel">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="MasterViewPanel" LoadingPanelID="LoadingPanel1" />
                <telerik:AjaxUpdatedControl ControlID="DetailPanel" LoadingPanelID="LoadingPanel1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
        <telerik:AjaxSetting AjaxControlID="DetailPanel" >
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="MasterViewPanel" LoadingPanelID="LoadingPanel1"  />
                <telerik:AjaxUpdatedControl ControlID="DetailPanel" LoadingPanelID="LoadingPanel1" />   
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManagerProxy>
  
 
<asp:Panel ID="MasterViewPanel" runat="server">
 
Some fake info here... click to see details..<br />
<asp:Button ID="ShowDetailPanel" runat="server" Text="Show Detail"
        onclick="ShowDetailPanel_Click"/>
 
 
</asp:Panel>
 
<asp:Panel ID="DetailPanel" runat="server" Visible="false" >
 
    <label>Some fake field:</label><br />
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <br /><br />
 
    <label>Editor 1:</label><br />
    <telerik:RadEditor runat="server" ID="RadEditor1" MaxHtmlLength="10"></telerik:RadEditor>         
    <br /><br />
    
    <label>Editor 2:</label><br />
    <telerik:RadEditor runat="server" ID="RadEditor2" ></telerik:RadEditor>
  
    <br /><br />
 
    <telerik:RadButton runat="server" ID="SaveRadButton" runat="server" Text="Save"
            UseSubmitBehavior="false" onclick="SaveRadButton_Click" />
     
    <telerik:RadButton runat="server" ID="CancelRadButton" runat="server"
            Text="Cancel" onclick="CancelRadButton_Click" />
 
</asp:Panel>
 
 
<div style="display:none">
    <!-- Hidden editor To help Render the correct scripts etc -->
    <telerik:RadEditor runat="server" ID="FakeRadEditor" ></telerik:RadEditor>
</div>
 
</asp:Content>



Code Behind




using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Threading;
 
namespace RadEditorTest
{
    public partial class Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
 
        }
 
        protected void SaveRadButton_Click(object sender, EventArgs e)
        {
            //do some fake save!
            Thread.Sleep(1000);
 
            MasterViewPanel.Visible = true;
            DetailPanel.Visible = false;
        }
 
        protected void CancelRadButton_Click(object sender, EventArgs e)
        {
            //cancel
            MasterViewPanel.Visible = true;
            DetailPanel.Visible = false;
        }
 
        protected void ShowDetailPanel_Click(object sender, EventArgs e)
        {
            //sleep so that the loading panel will show...
            Thread.Sleep(1000);
            MasterViewPanel.Visible = false;
            DetailPanel.Visible = true;
        }
    }
}

answered on 06 Dec 2012, 11:30 AM

Hi,

The issue appears because RadEditor cancels the callback to the server but the AjaxLoadingPanel continues to wait for a response which will never come.

To workaround the issue, hide the AjaxLoadingPanel after showing the alert message using the following script:

<telerik:RadEditor ID="txtSample" runat="server" MaxTextLength="1">

</telerik:RadEditor>

<script type="text/javascript">

var panel = null;

var editor = null;

Telerik.Web.UI.RadEditor.prototype.displayMaxTextLengthErrorMessage = function () {

panel = $find("<%=RadAjaxLoadingPanel1.ClientID %>");

editor = "<%=pnlContent.ClientID %>";

alert(this.get_localization()["exceededtextlength"] + " " + this.get_maxTextLength() + ". " + this.get_localization()["reducetheconentlength"] + ".");

if (panel != null) {

setTimeout(function () {

panel.hide(editor);

}, 1000);

}

</script>

For your convenience I have attached my test page: Default.aspx.

Kind regards,
Rumen
the Telerik team

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 their blog feed now.