Ajax UpdatePanel Loading CSS

3 posts, 0 answers
  1. Kishor Dalwadi
    Kishor Dalwadi avatar
    40 posts
    Member since:
    Nov 2009

    Posted 26 Aug 2010 Link to this post

    Hi Sir,

    I am using ajaxupdatepanel in my entire application.

    But in some pages i have use to normal update panel.

    But when loading ui look diffrent.

    So please can u give me CSS for that i using that in my update progress.

    For that my entire application looking same.

    Please give me proper solution.

    Thanks.

    Kishor Dalwadi.
  2. Dimo
    Admin
    Dimo avatar
    8482 posts

    Posted 26 Aug 2010 Link to this post

    Hi Kishor,

    You need to do two things:

    1. Register the RadAjaxLoadingPanel CSS files manually with RadStyleSheetManager
    2. Put inside the ProgressTemplate the same HTML code and CSS classes as the ones that RadAjaxLoadingPanel uses.


    <%@ 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);
                Label1.Text = DateTime.Now.ToLongTimeString();
            }
        }
         
    </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">
     
    html,body,form
    {
        margin:0;
        padding:0;
    }
     
    </style>
    </head>
    <body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server" />
     
    <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server">
        <StyleSheets>
            <telerik:StyleSheetReference Assembly="Telerik.Web.UI" IsCommonCss="true" Name="Telerik.Web.UI.Skins.Ajax.css" />
            <telerik:StyleSheetReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Skins.WebBlue.Ajax.WebBlue.css" />
        </StyleSheets>
    </telerik:RadStyleSheetManager>
     
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            <asp:Panel ID="Panel1" runat="server">
                <asp:Button ID="Button1" runat="server" Text="AJAX" />
                <br />
                <asp:Label ID="Label1" runat="server" Text="" />
            </asp:Panel>
        </ContentTemplate>
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="Button1" />
        </Triggers>
    </asp:UpdatePanel>
     
    <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
        <ProgressTemplate>
            <div class="RadAjax RadAjax_WebBlue" style="position:absolute;top:0;left:0;width:100%;height:100%;">
                <div class="raColor raTransp">
                    <!-- -->
                </div>
                <div class="raDiv">
                    <!-- -->
                </div>
            </div>
        </ProgressTemplate>
    </asp:UpdateProgress>
     
    </form>
    </body>
    </html>


    Greetings,
    Dimo
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. Kishor Dalwadi
    Kishor Dalwadi avatar
    40 posts
    Member since:
    Nov 2009

    Posted 26 Aug 2010 Link to this post

    Thanks

    I grateful to you.

    Kishor Dalwadi.
Back to Top