This is a migrated thread and some comments may be shown as answers.

RadAjax problem with Web User Control

2 Answers 74 Views
Ajax
This is a migrated thread and some comments may be shown as answers.
Sunil
Top achievements
Rank 1
Sunil asked on 17 Aug 2010, 05:08 PM
Hi,

I have a .aspx page with web user controls loaded dynamically into a panel called Main_PH. Everything works as it should. However, when I try to introduct RadAjaxManager with loading panels things don't go so great.

Below is my code for the default.aspx page

<telerik:RadCodeBlock ID="Default_RadCodeBlock" runat="server">
  
          
        <script type="text/javascript">
            function RequestStart(sender, eventArgs) {
                var loadingImage = document.getElementById('<%= Default_RadAjaxLoadingPanel.FindControl("Image1").ClientID %>');
                var panel1 = $get("WUC_default_wuc_Panel_Loading");
                loadingImage.style.position = "relative";
                loadingImage.style.top = (parseInt(panel1.style.height) / 2) + "px";
            }
            function MyClientShowing(sender, args) {
                args.get_loadingElement().style.border = "2px solid red";
                args.set_cancelNativeDisplay(true);
                $telerik.$(args.get_loadingElement()).show("slow");
            }
  
            function MyClientHiding(sender, args) {
                args.get_loadingElement().style.border = "2px solid blue";
                args.set_cancelNativeDisplay(true);
                $telerik.$(args.get_loadingElement()).hide("slow");
            }  
    </script>  
  
  
    </telerik:RadCodeBlock>
      
      
      
</head>
<body id="home">
<form id="Default_Master_Form" runat="server">
  
    <telerik:RadScriptManager ID="Default_ScriptManager" runat="server" />
  
    <telerik:RadAjaxManager ID="Default_RadAjaxManager" runat="server" 
        DefaultLoadingPanelID="Default_RadAjaxLoadingPanel">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="LinkButton_MM_Inbox">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="Panel_Loading"  
                        LoadingPanelID="Default_RadAjaxLoadingPanel">
                    </telerik:AjaxUpdatedControl>
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
        <ClientEvents OnRequestStart="RequestStart" />
    </telerik:RadAjaxManager>
  
    <telerik:RadAjaxLoadingPanel ID="Default_RadAjaxLoadingPanel" runat="server" Transparency="30" Skin="Default">
         <div class="loading">  
                        <asp:Image ID="Image1" runat="server" ImageUrl="~/Images/loading2.gif" />  
                    </div
    </telerik:RadAjaxLoadingPanel>
  
......
  
  <asp:PlaceHolder ID="Main_PH" runat="server">
            </asp:PlaceHolder>

Here is the code for the pre-render in code behind of default.aspx

protected void Page_PreRender(object sender, EventArgs e)
        {
            Default_RadAjaxLoadingPanel.OnClientShowing = "MyClientShowing";
            Default_RadAjaxLoadingPanel.OnClientHiding = "MyClientHiding";
        }


Here is the code for the .ascx page which is loaded into Main_PH

<asp:Panel ID="Panel_Loading" runat="server" CssClass="loading_panel" Height="440px">
  
                    <h2>
                        Administration</h2>
                    <div class="content_main">
  
                            <h3>
                                1. Employee Settings - Personal</h3>
                            <div>
                                <label for="empid_ti">
                                    Employee Id 
                                    <asp:Button ID="Button1" runat="server" Text="Button" CausesValidation="false"/></label>
                                <asp:TextBox ID="TextBox1" runat="server" EnableViewState="true"></asp:TextBox></div>
  
</asp: Panel>


When I click on the button LinkButton_MM_Inbox from the default.aspx page, what happens is the animation starts, finishes etc on the Panel_Loading from the .ascx and an Ajax postback happens but a new Web User Control.ascx does not appear on the page (which is what is supposed to happen).

If I change the code in the default.aspx page to this: (Main_PH instead of Panel_Loading...

<telerik:AjaxSetting AjaxControlID="LinkButton_MM_Inbox">
               <UpdatedControls>
                   <telerik:AjaxUpdatedControl ControlID="Main_PH"  
                       LoadingPanelID="Default_RadAjaxLoadingPanel">
                   </telerik:AjaxUpdatedControl>
               </UpdatedControls>
           </telerik:AjaxSetting>

... the Ajax postback happens, the new web user control is added as should happen but I don't get the animation in Panel_Loading.

I'm not really sure what to do?? I can't add the animations to Main_PH because Main_PH is heavily styled from the user controls and the animation will not show.

Any suggestions would be great! Thanks!

Sunny

2 Answers, 1 is accepted

Sort by
0
Accepted
Veli
Telerik team
answered on 20 Aug 2010, 10:16 AM
Hello Sunil,

With your RadAjaxManager in the content page, your updated panel should be in the content page too. You can have a panel around your user control place holder and AJAX-ify that:

<telerik:RadAjaxManager ID="Default_RadAjaxManager" runat="server"
    DefaultLoadingPanelID="Default_RadAjaxLoadingPanel">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="LinkButton_MM_Inbox">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="PanelWrapper" 
                    LoadingPanelID="Default_RadAjaxLoadingPanel">
                </telerik:AjaxUpdatedControl>
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
    <ClientEvents OnRequestStart="RequestStart" />
</telerik:RadAjaxManager>
 
<telerik:RadAjaxLoadingPanel ID="Default_RadAjaxLoadingPanel" runat="server" Transparency="30" Skin="Default">
     <div class="loading"
                    <asp:Image ID="Image1" runat="server" ImageUrl="~/Images/loading2.gif" /> 
                </div>
</telerik:RadAjaxLoadingPanel>
 
......
 
<asp:Panel Id="PanelWrapper" runat="server">
    <asp:PlaceHolder ID="Main_PH" runat="server">
    </asp:PlaceHolder>
</asp:Panel>


Veli
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
0
Sunil
Top achievements
Rank 1
answered on 24 Aug 2010, 03:29 PM
This worked, thank you :)
Tags
Ajax
Asked by
Sunil
Top achievements
Rank 1
Answers by
Veli
Telerik team
Sunil
Top achievements
Rank 1
Share this question
or