Hello,
Here is how to achieve the described functionality with
RadControls for ASP.NET AJAX.
Instead of the RadGrid wrapper element, any HTML element can be used to set the "wait" CSS class to.
<%@ Page Language="C#" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (IsPostBack)
{
System.Threading.Thread.Sleep(5000);
}
}
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<head runat="server">
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>RadControls</title>
<style type="text/css">
.wait,
.wait *
{
cursor:wait !important;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
<script type="text/javascript">
function showHourGlass(sender, args)
{
Sys.UI.DomElement.addCssClass($get("<%= RadGrid1.ClientID %>"), "wait");
}
function hideHourGlass(sender, args)
{
Sys.UI.DomElement.removeCssClass($get("<%= RadGrid1.ClientID %>"), "wait");
}
</script>
</telerik:RadCodeBlock>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
<ClientEvents OnRequestStart="showHourGlass" OnResponseEnd="hideHourGlass" />
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="RadGrid1">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="RadGrid1" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadGrid
ID="RadGrid1"
runat="server"
Width="800px"
Skin="Vista"
AllowSorting="true"
DataSourceID="RadGridDataSource">
<MasterTableView CommandItemDisplay="Top" />
</telerik:RadGrid>
<asp:XmlDataSource ID="RadGridDataSource" runat="server">
<Data>
<nodes>
<node ID="1" Name="Name 1" Description="Description 1" />
<node ID="2" Name="Name 2" Description="Description 2" />
<node ID="3" Name="Name 3" Description="Description 3" />
<node ID="4" Name="Name 4" Description="Description 4" />
</nodes>
</Data>
</asp:XmlDataSource>
</form>
</body>
</html>
Regards,
the Telerik team