Thanks for the response.
As you requested I have prepared a sample code that recreates the issue. As I said it used to work fine using the older version (2008) to display the sections top down.
Also there is another behavior broken with the latest version. I used to disable the dropdown when the sections are loading and enable again once the sections are loaded. Now once it is loaded the combobox display does not come back to enabled state. This also used to work fine in the 2008 version of telerik.
Please look at the code and let me know what needs to be fixed to get the correct behavior. Thanks in advance!
WeForm1.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="RadAjaxLoadingPanelIssue.RadAjaxManagerReverseLoading.WebForm1" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<head runat="server">
<title></title>
<telerik:RadCodeBlock ID="radCodeBlock" runat="server">
<script language="javascript" type="text/javascript">
window.onload = function () {
ShowBusyBox();
}
function RequestEnd() {
HideBusyBox();
}
function ShowBusyBox() {
var cbCtrl = $find("<%=dropdown.ClientID%>");
cbCtrl.set_enabled(false);
}
function HideBusyBox() {
var cbCtrl = $find("<%=dropdown.ClientID%>");
cbCtrl.set_enabled(true);
}
function OnAJAXRequestStart() {
ShowBusyBox();
}
function OnAJAXRequestEnd() {
HideBusyBox();
}
function OnClientLoad() {
ShowBusyBox();
}
function OnClientSelectedIndexChanged() {
ShowBusyBox();
}
</script>
</telerik:RadCodeBlock>
</head>
<body>
<form id="form1" runat="server">
<div>
<telerik:RadScriptManager ID="RadScriptManager1" EnableScriptCombine="true" EnableScriptGlobalization="true" EnableScriptLocalization="true" runat="server">
<Scripts>
</Scripts >
</telerik:RadScriptManager>
<telerik:RadComboBox ID="dropdown" Width="400px"
runat="server" ShowToggleImage="true" AllowCustomText="false" RadComboBoxImagePosition="Right"
UseEmbeddedScripts="false" MarkFirstMatch="true" AutoPostBack="True" OnSelectedIndexChanged="SeclectedItemChanged"
OnClientSelectedIndexChanged="ShowBusyBox" OnClientLoad="OnClientLoad">
</telerik:RadComboBox>
<br /><br />
<telerik:RadAjaxManager ID="psRadAjaxManager" runat="server"
OnAjaxSettingCreating="psRadAjaxManager_AjaxSettingCreating" ClientEvents-OnRequestStart="OnAJAXRequestStart" ClientEvents-OnResponseEnd="OnAJAXRequestEnd">
<AjaxSettings >
<telerik:AjaxSetting AjaxControlID="dropdown" >
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="dropdown" />
<telerik:AjaxUpdatedControl ControlID="mainPanel" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
<asp:Panel ID="mainPanel" runat="server">
</asp:Panel>
</div>
</form>
</body>
</html>
WebForm1.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Telerik.Web.UI;
using System.Collections;
namespace RadAjaxLoadingPanelIssue.RadAjaxManagerReverseLoading
{
public partial class WebForm1 : System.Web.UI.Page
{
private const string SECTION_ID_SUFFIX = "UcSection";
protected void Page_Load(object sender, EventArgs e)
{
LoadDropdown();
// Initialize the section template with empty content to render the containers with loading image
// The user controls needs to be rebuilt for each post back as the dynamically added controls are
// not preserved between the postbacks by ASP.NET
InitializeSectionContentTemplate();
}
private void LoadDropdown()
{
System.Collections.ArrayList list = new ArrayList();
list.Add("Item1");
list.Add("Item2");
list.Add("Item3");
list.Add("Item4");
list.Add("Item5");
dropdown.DataSource = list;
dropdown.DataBind();
}
private void InitializeSectionContentTemplate()
{
int numSections = 3;
for (int j = 0; j < numSections; j++)
{
Section ucSection = (Section)Page.LoadControl("Section.ascx");
ucSection.ID = "section_" + j + SECTION_ID_SUFFIX;
if (j == numSections - 1)
{
RadAjaxPanel radPanal = (RadAjaxPanel)ucSection.FindControl("sectionPanel");
radPanal.ClientEvents.OnResponseEnd = "RequestEnd";
}
mainPanel.Controls.Add(ucSection);
}
}
protected void SeclectedItemChanged(object o, RadComboBoxSelectedIndexChangedEventArgs e)
{
foreach (Control ctrl in this.mainPanel.Controls)
{
if ((ctrl.ID != null) && (ctrl.ID.EndsWith(SECTION_ID_SUFFIX)))
{
Section ucSection = (Section)ctrl;
ucSection.Reload();
}
}
}
protected void psRadAjaxManager_AjaxSettingCreating(object sender, AjaxSettingCreatingEventArgs e)
{
e.UpdatePanel.RenderMode = UpdatePanelRenderMode.Inline;
}
}
}
Section.ascx
Section.ascx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace RadAjaxLoadingPanelIssue.RadAjaxManagerReverseLoading
{
public partial class Section : System.Web.UI.UserControl
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
sectionTimer.Interval = 40;
InitializeSectionTemplate("initial content.");
}
}
private void InitializeSectionTemplate(string contentPrefix)
{
//this.litSectionContent.Text = "<img src='large-loading.gif' /><br/> " + "<div><span>" + contentPrefix+ " " + this.ClientID + " " + DateTime.Now.ToString() + "</span></div>";
this.litSectionContent.Text = "<img src='large-loading.gif' /><br/> ";
}
protected void DisplaySection(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(1000);
litSectionContent.Text = "<div><span>Loaded the content." + ((System.Web.UI.Control)(sender)).ClientID + " " + DateTime.Now.ToString() + "</span></div>";
sectionTimer.Interval = 99999999;
sectionTimer.Enabled = false;
ScriptManager.RegisterStartupScript(this, this.GetType(), "StopTimerScript", "<script language=\"JavaScript\" type=\"text/javascript\"> " + sectionTimer.ClientID + "._stopTimer();" + "</script>", false);
}
public void Reload()
{
sectionTimer.Interval = 40;
sectionTimer.Enabled = true;
InitializeSectionTemplate("Reloaded content");
}
}
}