Good Afternoon,
I am attempting to use RadAjax to build several SharePoint WebParts that each reach out to remote datasources, databind then display thier data. I am encountering an issue displaying individual loading panels while these controls perform thier initial load (This can be lengthy, a few seconds apiece).
The behviour I am looking for is to have individual RadAjaxUpdatePanels displayed while each control is loading. I have followed the example outlined here (http://www.telerik.com/help/aspnet-ajax/ajxshowloadingpaneloninitialpageload.html) and this works quite well, provided that not more than a single instance of the webpart appears on a given page or any other webpart that impliments this solution.
Attached to this solution is a simplified version of the WebPart logic that substitudes the databinding with a
System.Threading.Thread.Sleep call to simulate the call to an external resource.
When more than one instance of the same part that impliments this login is present on a page, only the call back seems to occure, by this I mean that at the same instance (after the prescribbed delay) the callback renders both webparts simultainiously.
When instances of different WebParts implimenting this logic are on a given page, only the second callback appears to occure and only the last webpart is rendered after the prescribed delay.
I hope that this is enough to make the issue clear enough to address. Below is the source of the WebPart in it's entirety;
MyWeek WebPart Code
MyWeekPart.cs
using System; |
using System.Text; |
using System.Collections.Generic; |
using System.Web; |
using System.Web.UI; |
using System.Web.UI.WebControls; |
using System.Web.UI.WebControls.WebParts; |
using Microsoft.Practices.SPG.Common.Logging; |
using Microsoft.Practices.SPG.Common.ServiceLocation; |
using Telerik.Web.UI; |
using NipissingU.Portal.Common.ExceptionHandling; |
using NipissingU.Portal.Common.Entities; |
using NipissingU.Portal.Colleague.Repositories; |
using NipissingU.Portal.Common.Utility; |
namespace NipissingU.Portal.WebPart.MyWeek |
{ |
public class MyWeekPart : Microsoft.SharePoint.WebPartPages.WebPart |
{ |
#region Fields... |
private Control myWeekControl; |
private Panel Panel1; |
private Panel Panel2; |
private RadAjaxLoadingPanel RadAjaxLoadingPanel1; |
#endregion |
#region Properties... |
IErrorVisualizer ErrorVisualizer { get; set; } |
#endregion |
#region Overridden Methods... |
protected override void OnInit(EventArgs e) |
{ |
base.OnInit(e); |
ScriptManager scriptManager = ScriptManager.GetCurrent(this.Page); |
if (scriptManager == null) |
{ |
scriptManager = new RadScriptManager(); |
this.Page.Form.Controls.AddAt(0, scriptManager); |
} |
Page.ClientScript.RegisterStartupScript(typeof(MyWeekPart), this.ID, "_spOriginalFormAction = document.forms[0].action;_spSuppressFormOnSubmitWrapper=true;", true); |
if (this.Page.Form != null) |
{ |
string formOnSubmitAtt = this.Page.Form.Attributes["onsubmit"]; |
if (!string.IsNullOrEmpty(formOnSubmitAtt) && formOnSubmitAtt == "return _spFormOnSubmitWrapper();") |
{ |
this.Page.Form.Attributes["onsubmit"] = "_spFormOnSubmitWrapper();"; |
} |
} |
} |
protected override void OnLoad(EventArgs e) |
{ |
base.OnLoad(e); |
ErrorVisualizer errorVisualizer = new ErrorVisualizer(); |
this.ErrorVisualizer = errorVisualizer; |
try |
{ |
this.Controls.Add(errorVisualizer); |
// Load the UserControl Template from the /TEMPLATE/CONTROLTEMPLATES directory. |
myWeekControl = Page.LoadControl("/_controltemplates/NipissingU/MyWeekControl.ascx"); |
// Add the Loaded control to the WebParts Control collection. This is important to |
// establish the Child Control Events! |
errorVisualizer.Controls.Add(myWeekControl); |
Panel1 = myWeekControl.FindControl("Panel1") as Panel; |
Panel2 = Panel1.FindControl("Panel2") as Panel; |
RadAjaxLoadingPanel1 = myWeekControl.FindControl("RadAjaxLoadingPanel1") as RadAjaxLoadingPanel; |
RadAjaxManager AjaxManager1 = RadAjaxManager.GetCurrent(this.Page); |
if (AjaxManager1 == null) |
{ |
AjaxManager1 = new RadAjaxManager(); |
AjaxManager1.ID = "RadAjaxManager1"; |
Controls.Add(AjaxManager1); |
this.Page.Items.Add(typeof(RadAjaxManager), AjaxManager1); |
} |
AjaxManager1.AjaxRequest += new RadAjaxControl.AjaxRequestDelegate(MyWeekPart_AjaxRequest); |
} |
catch (Exception ex) |
{ |
new ViewExceptionHandler().HandleViewException(ex, this.ErrorVisualizer, |
Constants.FriendlyError); |
} |
} |
protected override void OnPreRender(EventArgs e) |
{ |
base.OnPreRender(e); |
if (!this.CheckForWebPartDisplayMode(WebPartManager.BrowseDisplayMode)) |
{ |
new ViewExceptionHandler().ShowFunctionalErrorMessage(Constants.DisplayModeError, this.ErrorVisualizer); |
} |
} |
#endregion |
#region Events... |
protected void MyWeekPart_AjaxRequest(object sender, Telerik.Web.UI.AjaxRequestEventArgs e) |
{ |
try |
{ |
if (e.Argument == "MyWeekLoad") |
{ |
System.Threading.Thread.Sleep(2000); |
Panel2.Visible = true; |
Label Label2 = new Label(); |
Label2.Text = e.Argument; |
Panel2.Controls.Add(Label2); |
} |
} |
catch (Exception ex) |
{ |
} |
} |
#endregion |
#region Private Methods... |
protected bool CheckForWebPartDisplayMode(WebPartDisplayMode mode) |
{ |
bool flag = false; |
if ((base.WebPartManager != null) && (base.WebPartManager.DisplayMode == mode)) |
{ |
flag = true; |
} |
return flag; |
} |
#endregion |
} |
} |
Constants.cs
using System; |
namespace NipissingU.Portal.WebPart.MyWeek |
{ |
public static class Constants |
{ |
public static string FriendlyError = "My Week is currently unavailable. Please try again later."; |
public static string DisplayModeError = "The page is in edit mode. To show the contents of this web part, close the toolbar or refresh the web part."; |
} |
} |
MyWeekControl.aspx
<%@ Control Language="C#" AutoEventWireup="true" Inherits="NipissingU.Portal.WebPart.MyWeek.MyWeekControl, NipissingU.Portal.WebPart.MyWeek, Version=1.0.0.0, Culture=neutral, PublicKeyToken=fc876b2c4bf21e29" %> |
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI, Version=2009.3.1314.35, Culture=neutral, PublicKeyToken=121fae78165ba3d4" %> |
<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server"> |
<script type="text/javascript"> |
function addLoadEvent(func) |
{ |
var oldonload = window.onload; |
if (typeof window.onload != 'function') |
{ |
window.onload = func; |
} |
else |
{ |
window.onload = function() { |
if (oldonload) |
{ |
oldonload(); |
} |
func(); |
} |
} |
} |
function MyWeek_OnLoad() |
{ |
setTimeout( function(){ window["<%= RadAjaxManager.GetCurrent(this.Page).ClientID %>"].ajaxRequest("MyWeekLoad"); }, 50); |
} |
addLoadEvent(MyWeek_OnLoad); |
</script> |
</telerik:RadScriptBlock> |
<style type="text/css"> |
.module1 |
{ |
background-color: #dff3ff; |
border: 1px solid #c6e1f2; |
} |
</style> |
<telerik:RadAjaxManagerProxy ID="AjaxManagerProxy1" runat="server"> |
<AjaxSettings> |
<telerik:AjaxSetting AjaxControlID="Panel1"> |
<UpdatedControls> |
<telerik:AjaxUpdatedControl ControlID="Panel1" LoadingPanelID="RadAjaxLoadingPanel1" /> |
</UpdatedControls> |
</telerik:AjaxSetting> |
<telerik:AjaxSetting AjaxControlID="RadAjaxManager1"> |
<UpdatedControls> |
<telerik:AjaxUpdatedControl ControlID="Panel1" LoadingPanelID="RadAjaxLoadingPanel1" /> |
</UpdatedControls> |
</telerik:AjaxSetting> |
</AjaxSettings> |
</telerik:RadAjaxManagerProxy> |
<fieldset class="module1"> |
<asp:Panel ID="Panel1" runat="server" HorizontalAlign="Center" Height="150px"> |
<asp:Panel ID="Panel2" runat="server" Visible="False"> |
<asp:Button ID="Button1" runat="server" Text="Click to see the loading image" OnClick="Button1_Click" |
Style="margin-top: 15px; margin-left: 15px" /> |
<br /> |
<asp:Label ID="Label1" runat="server" Text="Before Ajax..."></asp:Label> |
</asp:Panel> |
</asp:Panel> |
</fieldset> |
<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server"> |
<div align="center" class="nu-loadingpanel-container"> |
<div class="dt-bigthrobber"> </div> |
<div>Loading...</div> |
</div> |
</telerik:RadAjaxLoadingPanel> |
MyWeekControl.cs
using System; |
using System.Data; |
using System.Configuration; |
using System.Collections; |
using System.Web; |
using System.Web.Security; |
using System.Web.UI; |
using System.Web.UI.WebControls; |
using System.Web.UI.WebControls.WebParts; |
using System.Web.UI.HtmlControls; |
using Telerik.Web.UI; |
namespace NipissingU.Portal.WebPart.MyWeek |
{ |
public partial class MyWeekControl : System.Web.UI.UserControl |
{ |
#region Fields... |
protected Label Label1; |
protected Panel Panel1; |
protected Button Button1; |
protected RadAjaxLoadingPanel RadAjaxLoadingPanel1; |
#endregion |
protected void Button1_Click(object sender, EventArgs e) |
{ |
System.Threading.Thread.Sleep(2000); |
Label1.Text = DateTime.Now.ToLongTimeString(); |
} |
} |
} |
Christian