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

RadPane will not expand on an iPad

1 Answer 22 Views
Splitter
This is a migrated thread and some comments may be shown as answers.
Eric
Top achievements
Rank 1
Eric asked on 31 Dec 2014, 04:52 PM
I've stripped down my project to the barest of minimums - you can open this with no code behind and find that the left sliding zone works properly however the second set does not. I've found that ( in this particular case ) commenting the <br / > s out - lets the sliding zone work again ? I am having the same issues in my full project and this does not correct the sliding pane issues there but does here - after stripping out all other code and controls.

I'm testing using Chrome's emulator = iPAD simulation
Note that when using a real iPAD it exhibits identical behavior - 

Also noteable:   all of my radsliders are un-responsive as well in iPAD mode

You'll also see I've tried both old and new Html and Doctype declarations - no differences found 

Currently
Using VS 2012 - target framework is 4.5
     Referencing Telerik v 2014.2.724.45  Web.Design / Web.Device.Detection / Web.UI / Web.UI.Skins

A better understanding of these anomalies might help me discover why my real app will not perform on the iPAD.



<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SearchView.aspx.cs" Inherits="Views.SearchView" Async="true" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>




<%--<!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">--%>

<!DOCTYPE html>
<html>
    

<head id="Head1" runat="server">
    <title></title>
</head>


<body class="bodystyle">

    <form id="form1" runat="server">
        
        
       
        <telerik:RadScriptManager runat="server" ID="RadScriptManager1" EnablePageMethods="True">
            
        </telerik:RadScriptManager>

            Set Chrome emulation mode to Apple iPad 3 / 4 then -- comment the 3 < br / >  out / uncomment to see the effects 
            
            <telerik:RadSplitter runat="server" ID="RadSplitter1" Height="100%" Width="100%" Orientation="Vertical">

                <telerik:RadPane runat="Server" ID="radpane1" Width="10px" MinWidth="10" MaxWidth="300" Scrolling="None" CssClass="radpane1" ShowContentDuringLoad="False">

                    <telerik:RadSlidingZone ID="slidingzone1" runat="server" Width="25px" DockedPaneId="pane1" ClickToOpen="True" RenderMode="Classic">

                        <telerik:RadSlidingPane ID="pane1" Title="ABC Works fine" runat="server" Width="275" MinWidth="25" MaxWidth="275">

                            <asp:Panel runat="server" ID="panelAroundMenu">

                            </asp:Panel>

                        </telerik:RadSlidingPane>

                    </telerik:RadSlidingZone>

                </telerik:RadPane>

                <telerik:RadSplitBar ID="RadSplitbar1" runat="server">
                </telerik:RadSplitBar>
                
                <telerik:RadPane runat="Server" ID="radpane22">
                    
                    <div id="divBody" runat="server" class="divBody">

                        <telerik:RadMultiPage ID="RadMultiPage1" runat="server" SelectedIndex="0">

                            <telerik:RadPageView ID="rpvCreate" runat="server">

                                <telerik:RadSplitter runat="server" ID="RadSplitter2" Orientation="Horizontal" >

                                    <telerik:RadPane runat="Server" ID="radpane11" Height="20px" MaxWidth="980" Scrolling="None" ShowContentDuringLoad="False">


                                        <telerik:RadSlidingZone ID="ListMetricsSlidingZone" runat="server" Width="25px"
                                            DockedPaneId="ListMetricsPane" RenderMode="Auto" ClickToOpen="True" SlideDirection="Bottom"
                                            BorderStyle="Dotted" BorderWidth="1px" BorderColor="Black">

                                            <telerik:RadSlidingPane ID="ListMetricsPane" Title="DEF" runat="server" Height="340">
                                                
                                                Cannot collapse in iPAD emulation UNTIL the three < br / > 's below are commented out

                                            </telerik:RadSlidingPane>

                                          
                                              <telerik:RadSlidingPane ID="ListHistorySlidingPane1" Title="XYZ" Font-Size="X-Large" runat="server" Height="340">
                                              
                                                    Cannot expand - in iPAD emulation UNTIL the three < br / > 's below are commented out

                                            </telerik:RadSlidingPane>


                                        </telerik:RadSlidingZone>

                                    </telerik:RadPane>




                                    <telerik:RadPane runat="Server" ID="radpane33" Scrolling="None" ShowContentDuringLoad="False">

                                        <table class="maintable">
                                            <tr>
                                                <td style="vertical-align: top;">
                                                    <div id="divWrapper" runat="server">
                                                        <div id="dfssfddfsfdfd" runat="server" style="display: block">
                                                        </div>
                                                    </div>
                                                </td>
                                            </tr>
                                        </table>

                                    </telerik:RadPane>

                                </telerik:RadSplitter>

                            </telerik:RadPageView>
                            
                        </telerik:RadMultiPage>
                        
                        
                        <br />
                        <br />
                        <br />
                        

                    </div>
                
                        <%--                     
                        <br />
                        <br />
                        <br />
                            fails here as well -- when uncommented
                        --%>

                </telerik:RadPane>
                
            </telerik:RadSplitter>
        
        

    </form>

</body>


</html>

1 Answer, 1 is accepted

Sort by
0
Vessy
Telerik team
answered on 05 Jan 2015, 11:17 AM
Hi Eric,

I have just answered your support ticket on the subject - for convenience I am pasting my answer here as well:

Thank you for the provided sample code - we managed to reproduce the problematic behavior and it turned out to be related with the touch-scroll extender used in the Splitter. Commenting/uncommenting the three <br/> elements respectively disables/enables the scrolling of radPane22 and ListMetricsSlidingZone, which seems to prevent the click event of all buttons in this area. I am will log this issue for a further investigation, as for the time being you can work around the situation by disabling the scrolling of all RadPanes, having a child Splitter (so only the Splitter's scrolling will be functioning). For example:

<telerik:RadPane runat="Server" ID="radpane22" Scrolling="None">
    ...
</telerik:RadPane >

I hope this information will be helpful for you. You Telerik Points were also updated accordingly.

Regards,
Vessy
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
Splitter
Asked by
Eric
Top achievements
Rank 1
Answers by
Vessy
Telerik team
Share this question
or