[Solved] RadGrid freeze Chrome and Safari on any Apple device

[Christian]

Hello, 

We are experienced an issue with radGrid on iPad/iPhone/iPod. On any postback (trying to retrieve a record, ordering by clicking the column header, changing the page size) the entire browser is blocked. The only way to go back is to force closing the browser and reopen it. 

Mention : The Android devices are working good, also the all browsers on desktop using Windows. 

Mention : The radGrid is placed in a radWindow.

Trying to isolate the problem found that this is happening even on a simple radGrid in a dummy window. Is there something we are missing? Are we wrong with something else? Can you reproduce the problem? 

Telerik version : 2016.1.113.40

This is the source code we are using in order to reproduce the problem .

Thank you!

 

ASPX : 

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="DummyLookupContent.ascx.cs" Inherits="wMobilePC.Web.UI.Contents.DummyLookupContent" ClassName="wMobilePC.Web.UI.Contents.DummyLookup" %><br><telerik:RadCodeBlock ID="rcbMain" runat="server"><br>    <script type="text/javascript"><br>        var oWnd = RadWindow_GetRadWindow();<br>        oWnd.set_visibleStatusbar(false);<br>        oWnd.set_width(700);<br>        oWnd.set_height(500);<br>        oWnd.center();<br>       <br><br>    </script><br></telerik:RadCodeBlock><br><br><br><telerik:RadGrid ID="grd" runat="server" AutoGenerateColumns="true"<br>        AllowCustomPaging="True" AllowPaging="True" OnNeedDataSource="grd_NeedDataSource"<br>        PageSize="10" EnableLinqExpressions="false" Height="400px" Width="100%" ><br>        <MasterTableView AllowFilteringByColumn="True" AllowCustomSorting="True" AllowSorting="True"<br>            CanRetrieveAllData="False" EnableColumnsViewState="True" EnableViewState="True"<br>            TableLayout="Fixed"><br>            <PagerStyle AlwaysVisible="true" /><br>        </MasterTableView><br>        <ClientSettings AllowKeyboardNavigation="true"><br>            <Selecting AllowRowSelect="True" /><br>            <Scrolling AllowScroll="true" UseStaticHeaders="true" /><br>            <KeyboardNavigationSettings AllowActiveRowCycle="true" EnableKeyboardShortcuts="false" /><br>        </ClientSettings><br>    </telerik:RadGrid>

 

Code behind : 

namespace wMobilePC.Web.UI.Contents<br>{<br>    public partial class DummyLookupContent : UserControl, IWebContent<br>    {<br>        public string Name<br>        {<br>            get; set;<br>        }<br><br>        public bool IsReadOnly<br>        {<br>            get; set;<br>        }<br><br>        public string Id<br>        {<br>            get; set;<br>        }<br><br>        public string Title<br>        {<br>            get; set;<br>        }<br><br>        public Control Control<br>        {<br>            get { return this; }<br>        }<br><br>        public bool IsDirty<br>        {<br>            get; set;<br>        }<br><br>        public IDataContext DataContext<br>        {<br>            get; set;<br>        }<br><br>        public IWebWorkspace Workspace<br>        {<br>            get; set;<br>        }<br><br>        protected void Page_Load(object sender, EventArgs e)<br>        {<br>            LoadAjaxSettings();<br>        }<br><br>        protected void grd_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)<br>        {<br>            DataSet ds = ContactService.GetAllContacts(SecurityContext.LoggedInUser, GMContactType.Primary, "Company LIKE '%c%'", string.Empty, 0, 100);<br><br>            grd.DataSource = ds.Tables[0];<br>        }<br><br>        public Control GetView(string name)<br>        {<br>            return null;<br>        }<br><br>        public void SaveContent(object info)<br>        {<br>            <br>        }<br><br>        public void Initialize(object info)<br>        {<br>            <br>        }<br><br>        public void LoadContent(object info)<br>        {<br>            <br>        }<br><br>        public void RefreshContent(object info)<br>        {<br>           <br>        }<br><br>        public bool IsRefreshRequired(object info)<br>        {<br>            return false;<br>        }<br><br>        private void LoadAjaxSettings()<br>        {<br>            RadAjaxManager.GetCurrent(Page).AjaxSettings.AddAjaxSetting(grd, grd);<br>        }<br>    }<br>}

 

[Pavlina]

Hello,

Could you confirm that you are not receiving any error while sorting or paging the grid? Also can you replicate the same problem in any grid demo when you open it on Apple device?

Regards,
Pavlina
Telerik

[Christian]

Hello Pavlina,

I can confirm that i am not receiving any error on server/client side at all. Yes i can replicate the same problem in any grid demo on any Apple device only if the grid is placed in a radWindow. Otherwise the grid is working well .

Are you able to reproduce the problem using the code above?

 

Kind Regards,

Andrei

[Pavlina]

Hi,

I tested Grid in Window on different Apple devices and everything seems ok. Find attached mu test page, give it a try and see what is the difference in your case.

Regards,
Pavlina
Telerik

[Christian]

Hi, 

Thanks for your test page. It seems that i found the cause, a little weird but here's my note: i used 

RadAjaxManager.GetCurrent(Page).AjaxSettings.Clear();         RadAjaxManager.GetCurrent(Page).AjaxSettings.AddAjaxSetting(grd, grd);

in order to ajaxify the grid for avoiding the postback on changing pages/using filters/sorting etc. 

Removing this solved my problem, but i still have the postback problem. 

One mention, have you noticed that it's imposible to use filter textboxes in the radWindow in your example (using touche devices)? And when i'm tapping the button for changing filter (ex : to "NoFilter" or "Contains") that little menu is appearing in the top left corner. Are these behaviors ok?

 

[Pavlina]

Hello,

I also added the AjaxSettings dynamically, however I was not able to observe the issue you encounter. The version of Telerik.Web.UI I used is 2016.1.113. Regarding the filtering functionality on mobile devices note that in order to work properly you should set RenderMode property of the grid to Mobile or Auto as I did in the attached modified example. More information about grid RenderMode is available in the article below:
http://docs.telerik.com/devtools/aspnet-ajax/controls/grid/mobile-support/render-modes

Regards,
Pavlina
Telerik