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

RaDSplitter, RadAjaxManager, RadLoadingPane not showing

3 Answers 34 Views
Splitter
This is a migrated thread and some comments may be shown as answers.
Neal
Top achievements
Rank 1
Neal asked on 14 Oct 2015, 12:57 PM

 Hi

I have been unable to resolve this problem, even using asp:panels as suggested.

I have a RadSplitter (v2015.3), alignment is horizontal.

2 panes reside within it.

One at the Top for a RadMenu.

One beneath as a contentPane.

Menu items when clicked, do not show the LoadingPanel.

 Thx

Neal

My Markup is :

<body style="border:none; background-color:Black"
    <form id="form1" runat="server">
     
        <telerik:RadScriptManager ID="Scriptmanager1" runat="server"
            AsyncPostBackTimeout="36000"
            EnableTheming="True">
        </telerik:RadScriptManager>
  
        <telerik:RadCodeBlock ID="xx" runat="server">
        <script language="javascript"  type="text/javascript">
 
            window.onresize = window.onload = pageLoad;
            function pageLoad() {
                var menu = $find("<%= RadMenu1.ClientID %>");
                var width = menu.get_element().offsetWidth;
                var singleItemLength = Math.floor(width / menu.get_items().get_count()) - 2 + "px";
 
                for (var i = 0; i < menu.get_items().get_count() ; i++) {
                    var li = menu.get_items().getItem(i).get_element();
                    li.style.width = singleItemLength;
                }
            }
 
            function OpenLogin()
            {
                var urlExtn "ms=" + new Date().getTime();
                var oWnd = radopen("LoginPg.aspx?" + urlExtn, "Login");
                oWnd.setSize(500, 233);
                oWnd.Center;
            }
             
            function MenuItemItemClicked(sender, args)
            {
                var itemValue = args.get_item().get_value();
                 
                if (itemValue == "11")
                {
                    ShowRadWinRegister();
                }
                if (itemValue == "12")
                {
                    OpenLogin();
                }
            }
             
            function ShowRadWinRegister()
            {
                var urlExtn "ms=" + new Date().getTime();
                var oWnd = radopen("Forms/ClientForms/Registration.aspx?" + urlExtn , "Register" );
                oWnd.moveTo( 20, 40 );
            }
 
            function RefreshParentPage()
            {
              $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("Rebind"); 
            }
             
           function OnClientShow(sender, eventArgs)
           {
                RadWindow.Center;
           }
            
           function ShowLoading()
           {
                $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("InitialPageLoad");
           }
 
 
       </script>
        </telerik:RadCodeBlock>
         
     
        <telerik:RadWindowManager
            ID= "RadWindowManager1"
            runat= "server"
            Overlay="true"
            Modal="true"  >
            <Windows>
                <telerik:RadWindow
                    runat="server"
                    ID="Login"
                    Width="500px"
                    Height="233px"
                    Behaviors="None"
                    VisibleStatusbar="False"
                    VisibleTitlebar="False" 
                    OnClientClose="RefreshParentPage"
                    >
               </telerik:RadWindow>
                
               <telerik:RadWindow
                    ID="Register"
                    runat="server"
                    Width="1020px"
                    Height="535px"
                    Top="40px"
                    Left="20px"
                    VisibleStatusbar="False"
                    style="display:none;"
                    Behaviors="Default"
                    InitialBehaviors="None"
                    OnClientShow="OnClientShow"
                    >
               </telerik:RadWindow>
            </Windows
        </telerik:RadWindowManager>
 
     
        <div id="oBox" class="oBox" >
             <!-- Div Top Center Text 50px height-->
             <div  id="DivTopText"
                   align="center"
                   class="DivTopText"  >
 
                   <div class="DivTopText" style="text-align:right">
                       <asp:Label ID="lblLoggedUser" runat="server" Text="" Visible="true"
                                width="360px" ForeColor="Black" Font-Size="Small"></asp:Label>
                  </div>
             </div>
        </div>    
         
        <div id="MenuDiv" align="center" class="MenuDiv"
                         style="position:absolute;top:47px;border:none 0 transparent; width:100%">
            
             <telerik:radsplitter id="RadSplitter1" runat="server" 
                    Height ="930px"  width="100%" 
                    liveresize="true" 
                    orientation="Horizontal"
                    ResizeWithParentPane="true"
                    ResizeMode="proportional"
                    BorderStyle="None" 
                    style="position:absolute;top:0px; left:0px; border:none 0 transparent " >
             
                <telerik:radpane id="NavPane"  
                                 runat="server" Height="30px"  scrolling="None"   BackColor="Black"
                                 style="position:absolute;top:0px;border:none 0 transparent; left: 0px; width: 100%;" >
                    <asp:Panel ID ="aspMenuPanel" runat="server">
                        <telerik:RadMenu ID="RadMenu1"
                                style="position:absolute;top:0px;border:none 0 transparent "
                                Height="32px"
                                runat="server" Width="100%"                     
                                skin="Black"
                                OnClientItemClicked="MenuItemItemClicked"
                                DataFieldID="ScreenId"
                                DataFieldParentID="ParentScreenId"
                                DataNavigateUrlField="Screen"
                                DataTextField="Title"
                                 
                                DataValueField="ScreenId"
                                OnItemDataBound="RadMenu1_OnItemDataBound" BorderStyle="None" CausesValidation="False" >
                        </telerik:RadMenu>                        
                   </asp:Panel>
                </telerik:radpane
                    
                <telerik:radpane id="RadPane2" runat="server" 
                      height="100%"  BorderStyle="none"
                      width="100%"
                      scrolling="None" style="position:absolute; top:62px; left:0px"  
                    <asp:Panel ID="aspOuterContentPanel" runat="server" ></asp:Panel>
                     <telerik:radsplitter id="RadSplitter2" runat="server"
                        orientation="Horizontal" BorderStyle="none" BorderWidth="0px"
                        EnableEmbeddedSkins="false"
                        Height="100%" width="100%">
                             <telerik:radpane id="ContentPane" BackColor="Black"
                                    runat="server" style="position:absolute; top:65px; left:0px; "
                                    Width="100%" Height="100%" BorderStyle="none"
                                    ContentUrl="LandingPage.aspx" 
                                   Scrolling="None">
                                  <asp:Panel ID="aspContentPanel2" runat="server" ></asp:Panel>
                            </telerik:radpane>
                     </telerik:radsplitter>
               </telerik:radpane>
 
             </telerik:radsplitter>
        
             <telerik:RadAjaxManager ID="RadAjaxManager1"  OnAjaxRequest="RadAjaxManager1_AjaxRequest"
            runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel1" >
            <ajaxsettings>
                 
                <telerik:AjaxSetting AjaxControlID="RadMenu1" >
                    <UpdatedControls>
                       <telerik:AjaxUpdatedControl ControlID="xx"   />
                         <telerik:AjaxUpdatedControl ControlID="RadWindowManager1"  />
                        <telerik:AjaxUpdatedControl ControlID="aspOuterContentPanel"  />
                        <telerik:AjaxUpdatedControl ControlID="RadSplitter1"  />
                         <telerik:AjaxUpdatedControl ControlID="RadSplitter2"  />
                        <telerik:AjaxUpdatedControl ControlID="RadMenu1"  />
                         <telerik:AjaxUpdatedControl ControlID="RadAjaxManager1"  />
                         <telerik:AjaxUpdatedControl ControlID="aspContentPanel2"  />
                    </UpdatedControls>
                </telerik:AjaxSetting>
 
                <telerik:AjaxSetting AjaxControlID="RadAjaxManager1" >
                    <UpdatedControls>
                       <telerik:AjaxUpdatedControl ControlID="xx"  />
                         <telerik:AjaxUpdatedControl ControlID="RadWindowManager1"  />
                        <telerik:AjaxUpdatedControl ControlID="RadMenu1"  />
                          <telerik:AjaxUpdatedControl ControlID="RadAjaxManager1"  />
                        <telerik:AjaxUpdatedControl ControlID="aspContentPanel2" />
                         
                    </UpdatedControls>
                </telerik:AjaxSetting>
                
                 
                 
            </ajaxsettings>
        </telerik:RadAjaxManager>
 
             <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server">
                 <asp:Image ID="Image1" ImageUrl="~/Images/loading5.gif"
                    BorderWidth="0px" AlternateText="Loading" runat="server" Style="margin-top: 145px;z-index:999999">
                </asp:Image>
           </telerik:RadAjaxLoadingPanel>                 
        </div>
    </form>
</body>

3 Answers, 1 is accepted

Sort by
0
Marin Bratanov
Telerik team
answered on 16 Oct 2015, 11:26 AM

Hi Neal,

If you want the RadWindows to show a loading indicator, you should set their ShowContentDuringLoad property to false: http://demos.telerik.com/aspnet-ajax/window/examples/showcontentduringload/defaultcs.aspx.

Individual RadPane instances also offer the ShowContentDuringLoad property so if you change their ContentUrl (either via server code or via JS), they can show a loading indicator by themselves.

Otherwise, if the menu navigates the entire page to a new URL, showing a loading indicator is not possible with our controls, because the browser disposes the page and our controls with it.

Regards,

Marin Bratanov
Telerik
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 Feedback Portal and vote to affect the priority of the items
0
Neal
Top achievements
Rank 1
answered on 19 Oct 2015, 12:56 PM

Hi Marin

I tried both of the first 2 options above. The first works if it is indeed a RadWindow.

However..

My RadMenu inside a S​plitter in the NavPane causes different aspx files to load in the 2nd Pane of my Splitter, (being the content pane.)

It is here that I am unable to get the loading panel to display.

I have tried putting asp panels inside these panes as suggested in other similar threads but no success.

Thx

Neal

0
Marin Bratanov
Telerik team
answered on 19 Oct 2015, 04:09 PM

Hello Neal,

Can you confirm the RadPane whose ContentUrl you set has its ShowContentDuringLoad property set to false?

I just tried the following and it works for me:

<script>
    function setUrl() {
        $find("<%=RadPane2.ClientID%>").set_contentUrl("some-page.aspx");
    }
</script>
<telerik:RadSplitter ID="RadSplitter1" runat="server">
    <telerik:RadPane ID="RadPane1" runat="server">
        <asp:Button ID="Button1" Text="set new url" OnClientClick="setUrl(); return false;" runat="server" />
    </telerik:RadPane>
    <telerik:RadPane ID="RadPane2" runat="server" ShowContentDuringLoad="false">
        <asp:Label ID="Label1" Text="some initial content" runat="server"  />
    </telerik:RadPane>
</telerik:RadSplitter>

In your case, RadPane2 corresponds to your RadPane2 if I understand correctly.

I also advise against setting a pane's dimensions to 100% because this would cause a conflict since it should not leave room for other adjacent panes.

If comparing your setup with this does not help you resolve the problem, I advise that you open a support ticket and send us a small runnable version of your page that showcases the problem so we can examine it.

Regards,

Marin Bratanov
Telerik
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 Feedback Portal and vote to affect the priority of the items
Tags
Splitter
Asked by
Neal
Top achievements
Rank 1
Answers by
Marin Bratanov
Telerik team
Neal
Top achievements
Rank 1
Share this question
or