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>
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
0
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:
I hope this information will be helpful for you. You Telerik Points were also updated accordingly.
Regards,
Vessy
Telerik
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.