How to display "loading"

2 posts, 0 answers
  1. TMLP
    TMLP avatar
    38 posts
    Member since:
    Jul 2009

    Posted 17 Dec 2009 Link to this post

    Hi,,

    My aspx page takes quite long to load, so I want to display a loading image during my page is loading. I've found a Ajax sample from your site, but I am getting error..
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="display initial load.aspx.cs" Inherits="loadingImgTest.display_initial_load" %> 
    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %> 
    <!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>  
     
       <script type="text/javascript">  
            window.onload = function()  
            {  
                setTimeout(function() {  
                window[ "<%= RadAjaxManager1.ClientID %>"].AjaxRequest("InitialPageLoad");  
                }, 200);  
            }  
        </script>   
     
     
     
     
    </head> 
    <body> 
        <form id="form1" runat="server">  
        <telerik:RadScriptManager ID="ScriptManager1" runat="server" /> 
        <telerik:RadAjaxManager runat="server" ID="RadAjaxManager1" OnAjaxRequest="RadAjaxManager1_AjaxRequest">  
            <AjaxSettings> 
                <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">  
                    <UpdatedControls> 
                        <telerik:AjaxUpdatedControl ControlID="Panel1" LoadingPanelID="AjaxLoadingPanel1" /> 
                    </UpdatedControls> 
                </telerik:AjaxSetting> 
            </AjaxSettings> 
          
        </telerik:RadAjaxManager> 
     
               <asp:Panel ID="Panel1" runat="server">  
                   <asp:Panel ID="Panel2" Visible="false" runat="server">  
                    My content:  
                  </asp:Panel> 
               </asp:Panel> 
                 
               <telerik:RadAjaxLoadingPanel ID="AjaxLoadingPanel1" runat="server" Height="75px" Width="75px">  
                   <asp:Image ID="Image1" runat="server" AlternateText="Loading..." ImageUrl="~/network.PNG"/>  
               </telerik:RadAjaxLoadingPanel>      
        <div> 
          
        </div> 
        </form> 
    </body> 
    </html> 

    here's CS file:
    using System;  
    using System.Collections.Generic;  
    using System.Linq;  
    using System.Web;  
    using System.Web.UI;  
    using System.Web.UI.WebControls;  
     
    namespace loadingImgTest  
    {  
        public partial class display_initial_load : System.Web.UI.Page  
        {  
            protected void Page_Load(object sender, EventArgs e)  
            {  
     
            }  
     
     
            protected void RadAjaxManager1_AjaxRequest(object sender, Telerik.Web.UI.AjaxRequestEventArgs e)  
            {  
                if (e.Argument == "InitialPageLoad")  
                {  
                    //simulate longer page load  
                    System.Threading.Thread.Sleep(2000);  
                      
                    Panel2.Visible = true;  
                }  
            }  
        }  
    }  
     
    Here's the error message

    The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).

    Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.

    Exception Details: System.Web.HttpException: The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).

    Could you help?
    Thanks..
  2. Johny
    Johny avatar
    80 posts
    Member since:
    Aug 2008

    Posted 18 Dec 2009 Link to this post

    Hi Loya,

    Please try the following modification:

    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server"
     
            <script type="text/javascript"
     
                window.onload = function() 
                { 
                    setTimeout(function() 
                    { 
                        $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("InitialPageLoad");  
                    }, 200); 
                     
                }   
            </script> 
     
        </telerik:RadCodeBlock> 

    I hope this helps
    Johny
Back to Top