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

RadGrid Frozen Columns Problem on Safari Browser in Apple IPAD

32 Answers 248 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Daniel
Top achievements
Rank 1
Daniel asked on 08 Feb 2011, 07:00 PM

I am using RadGrid  with static headers and frozen column for bulk update of data exactly as provided by your LiveDemo: Grid-Dataediting-ClientEditBatchUpdates.

The Rad Grid is working as expected for all browsers (IE on windows, Safari on windows, Firefox on windows) , but we are facing problems on horizontal scroll in safari on IPad.

 

Problem : The horizontal scroll on the grid does not move the headers, but it moves the data content. The expected behavior : on horizontal scroll, the headers and data should move on scroll.

Remember we have frozen columns on the grid.

This behavior is not working  only on mobile Safari . The control works as expected on  IE - windows, Safari - windows, Firefox - windows.

 

The only difference between the livedemo Grid-Dataediting-ClientEditBatchUpdates and my code is I have added frozen column ( first 2) on the grid.

32 Answers, 1 is accepted

Sort by
0
Daniel
Telerik team
answered on 11 Feb 2011, 10:48 PM
Hello Daniel,

This functionality (Frozen columns) is not supported in mobile browsers.
Please excuse us for any inconvenience caused.

Regards,
Daniel
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
Jeremy
Top achievements
Rank 1
answered on 22 Feb 2011, 11:44 PM
Wille there be any future support for this in the mobile browsers?

0
Daniel
Telerik team
answered on 25 Feb 2011, 05:29 PM
Hello Jeremy,

Unfortunately the Frozen columns are a quite complicated functionality that is very sensitive to cross-browser issues. Furthermore it is not suitable for mobile use due to the fact that it requires more resources because of the intensive use of DOM operations.

Regards,
Daniel
the Telerik team
Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
0
karthi
Top achievements
Rank 1
answered on 25 Apr 2011, 10:49 AM
HI
   Is there any way to implement frozen column using telerik grid in ipad.

Regards
Karthikeyan.
0
Daniel
Telerik team
answered on 25 Apr 2011, 11:50 AM
Hello Jeremy,

I'm afraid it is not possible to use this functionality in mobile browsers.

Regards,
Daniel
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

0
John Fetherolf
Top achievements
Rank 1
answered on 06 May 2013, 07:56 PM
Has this ever been updated?  We are seeing it in 2012 Q3.

Thanks,
Kevin

Kevin M. Betts
Lead Microsoft Developer
Kimball Midwest
0
Daniel
Telerik team
answered on 07 May 2013, 02:25 PM
Hello Kevin,

The frozen columns functionality will be supported on mobile devices but I'm afraid I can't give you a timeframe at this point. Please excuse us for any inconvenience caused.

Best regards,
Daniel
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
John Fetherolf
Top achievements
Rank 1
answered on 07 May 2013, 06:48 PM
Daniel,

Thanks for the response.  We will just keep an eye on the release notes for future versions of the grid.

Kevin M. Betts
Lead Microsoft Developer
Kimball Midwest               
0
Isabelle
Top achievements
Rank 1
answered on 22 May 2014, 06:20 PM
Has this ever been updated?
0
Dimitar
Telerik team
answered on 26 May 2014, 08:01 AM
Hello,

I have created a feature request for adding RadGrid Frozen Columns support for touchscreen devices at the Telerik UI for ASP.NET AJAX Ideas & Feedback Portal. There you may vote for this feature, comment it and track its status.

Regards,
Dimitar
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.

 
0
Prabhu
Top achievements
Rank 1
answered on 20 May 2016, 09:24 AM
is this issue fixed?
0
Dimitar
Telerik team
answered on 20 May 2016, 03:00 PM
Hello,

The RadGrid provides Frozen columns with next/prev buttons, which may be used for mobile devices. Check the second RadGrid on the Frozen Columns demo. In order to use Frozen Columns, you need to use the Prev/Next buttons.

Regards,
Dimitar
Telerik
Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
0
shashi
Top achievements
Rank 1
answered on 07 Jul 2016, 08:05 PM

I have enabled ClientSettings -> Scrolling -> FrozenColumnsCount but I can't see previous and next button.

 

please help me with this.

I am trying to test it on Mobile safari and mobile android.

Thanks 

0
Dimitar
Telerik team
answered on 08 Jul 2016, 07:53 AM
Hi,

As specified in the demo information, it is required that you set EnableNextPrevFrozenColumns="true" in addition to setting value to the FrozenColumnsCount property. And I would like to note that "Frozen columns with next/prev buttons" feature has been introduced in Q1 2015. If you are testing with an older product version, this feature is unavailable.

Regards,
Dimitar
Telerik by Progress
Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
0
shashi
Top achievements
Rank 1
answered on 13 Jul 2016, 08:33 PM

I am using 2016 version.

 

thanks!!!

0
Dimitar
Telerik team
answered on 14 Jul 2016, 01:03 PM
Hi,

Did you enable the buttons as specified in my previous reply?

Regards,
Dimitar
Telerik by Progress
Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
0
shashi
Top achievements
Rank 1
answered on 14 Jul 2016, 07:02 PM

I am using

<ClientSettings>

<Scrolling AllowScroll="true" UseStaticHeaders="true" FrozenColumnsCount="2" SaveScrollPosition="true" EnableNextPrevFrozenColumns="true">
</ClientSettings>

0
Dimitar
Telerik team
answered on 18 Jul 2016, 11:47 AM
Hi,
 I am afraid that the issue is not reproducible on my side with the settings provided.

In order to assist you in the most efficient way I would suggest that you to open a new support ticket and provide us with a very simplified runnable project that demonstrates the behavior that you describe. Thus, we could test your exact scenario locally and determine what might be causing the issue that you are experiencing. You can find guidelines how to prepare such a sample in the Isolating a problem in a sample project blog post. It would be helful, if you provide some screenshots of the issue as well.

Regards,
Dimitar
Telerik by Progress
Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
0
shashi
Top achievements
Rank 1
answered on 20 Jul 2016, 04:47 AM

I will make a working solution for it .

I am using the following code please let me know if you find a problem with it.

 

 

            <div class="row mar-left-0 mar-right-0">
                        <telerik:RadGrid ID="rgProvrAtndcInvNew" runat="server"  AllowPaging="True" GridLines="Both"
                            CssClass="table-responsive rad-width" AutoGenerateColumns="false" ShowGroupPanel="false"
                             MasterTableView-ExpandCollapseColumn-Visible="false" MasterTableView-ExpandCollapseColumn-Display="false"
                             PageSize="25" OnNeedDataSource="rgProvrAtndcInvNew_NeedDataSource" OnBatchEditCommand="rgProvrAtndcInvNew_BatchEditCommand" OnItemCreated="rgProvrAtndcInvNew_ItemCreated" >
                            <ClientSettings>
                                <Scrolling AllowScroll="true" UseStaticHeaders="true" FrozenColumnsCount="2" SaveScrollPosition="true" />
                                <ClientEvents  OnBatchEditOpening="BatcheditOpening" OnBatchEditOpened="BatcheditOpened" OnUserAction="userAction"  />
                            </ClientSettings>
                   <AlternatingItemStyle Font-Size="11px" HorizontalAlign="Center" />
                            <HeaderStyle Font-Bold="True" Font-Size="11px" Height="25px" HorizontalAlign="Center"   />
                            <ItemStyle Font-Size="11px" HorizontalAlign="Center" />
                                  <PagerStyle PagerTextFormat="{4}{5} records in {1} pages" />
                    <MasterTableView AutoGenerateColumns="False" ShowHeadersWhenNoRecords="true"  EditMode="Batch" TableLayout="fixed"  Width="100%" CssClass="radgridtest table table-striped table-hover table-bordered text-center" >
                        <BatchEditingSettings EditType ="cell" OpenEditingEvent="MouseOver" />

                        <ColumnGroups>
                            <telerik:GridColumnGroup Name="ClientName" HeaderText="&nbsp;"></telerik:GridColumnGroup>
                            <telerik:GridColumnGroup Name="Day1" ></telerik:GridColumnGroup>
                            <telerik:GridColumnGroup Name="Day2" HeaderText="2"></telerik:GridColumnGroup>
                            .
.
.
.
                            <telerik:GridColumnGroup Name="Day30" HeaderText="30"></telerik:GridColumnGroup>
                            <telerik:GridColumnGroup Name="Day31" HeaderText="31"></telerik:GridColumnGroup>
                        </ColumnGroups>
                        <Columns>
                            <telerik:GridTemplateColumn HeaderText="" UniqueName="NAM_CLIENT" ColumnGroupName="ClientName" HeaderStyle-Width="150px" >
                                <HeaderTemplate>
                                    <b>Sort By: </b>
                                    <asp:DropDownList ID="ddlSortBy" runat="server"  AutoPostBack="true">
                                        <asp:ListItem Text="Care Level" Value="CL"></asp:ListItem>
                                        <asp:ListItem Text="Last Name" Value="LN"></asp:ListItem>
                                        <asp:ListItem Text="Caretaker" Value="CN"></asp:ListItem>
                                        <asp:ListItem Text="Uploaded" Value="UP"></asp:ListItem>
                                    </asp:DropDownList>
                                </HeaderTemplate>
                                <ItemTemplate>
                                    <asp:Label ID="lblClientName" runat="server" Text='<%# Eval("NAM_CLIENT") %>'></asp:Label>
                                   
                                                                </ItemTemplate>
                                <ItemStyle HorizontalAlign="Left" Wrap="true" />
                                <HeaderStyle Width="150px"></HeaderStyle>
                            </telerik:GridTemplateColumn>
                            <telerik:GridTemplateColumn HeaderText="NC" DataField="IND_CHANGE_NO" UniqueName="IND_CHANGE_NO" ColumnGroupName="ClientName"  HeaderStyle-Width="25px">
                                <ItemTemplate>
                                    <asp:CheckBox ID="chkNoChange" runat="server" />
                                    <asp:Label ID="lblNoChange" runat="server" Visible="false" Text='<%# Eval("IND_CHANGE_NO") %>'></asp:Label>
                                    <asp:Label ID="lblNoChangeInd" runat="server" Visible="false" Text='<%# Eval("IND_CHANGE") %>'></asp:Label>
                                </ItemTemplate>

                            </telerik:GridTemplateColumn>
                            <telerik:GridTemplateColumn HeaderText="1" UniqueName="CDE_TYPE_UNIT_CARE_1" ColumnGroupName="Day1"  HeaderStyle-Width="25px">
                                 <ItemTemplate>
                                             <asp:Label ID="lblday1" runat="server" Text='<%# Eval("CDE_TYPE_UNIT_CARE_1") %>'  ></asp:Label>
                                 </ItemTemplate>
                                <EditItemTemplate>
                                        <asp:DropDownList runat="server" ID="ddCareUnit1" DataTextField="DISPLAYVALUE" DataValueField="KEYVALUE" CssClass="expected-dd"> </asp:DropDownList>
                                        </EditItemTemplate>

                            </telerik:GridTemplateColumn>
…
….
….

                            <telerik:GridTemplateColumn HeaderText="31" UniqueName="CDE_TYPE_UNIT_CARE_31" ColumnGroupName="Day31"  HeaderStyle-Width="25px">
                                   <ItemTemplate>
                                    <asp:Label ID="lblday31" runat="server" Text='<%# Eval("CDE_TYPE_UNIT_CARE_31") %>'  ></asp:Label>                                  
                                </ItemTemplate>
                                 <EditItemTemplate>

                                            <asp:DropDownList runat="server" ID="ddCareUnit31"  DataTextField="DISPLAYVALUE" DataValueField="KEYVALUE" CssClass="expected-dd"> </asp:DropDownList>
                                        </EditItemTemplate>
                            </telerik:GridTemplateColumn>
                        </Columns>
                    </MasterTableView>
                </telerik:RadGrid>
                </div>

 

 

Thanks !!

0
shashi
Top achievements
Rank 1
answered on 20 Jul 2016, 04:49 AM

Adding to previous post , in the grid I have total 34-35 column and I am trying to freeze first two column with static header.

 

 

Thanks !!!

0
shashi
Top achievements
Rank 1
answered on 20 Jul 2016, 04:51 AM

I am using it even though i missed this part while posting the code.

<Scrolling AllowScroll="true" UseStaticHeaders="true" FrozenColumnsCount="2" SaveScrollPosition="true" EnableNextPrevFrozenColumns="true">

 

Thanks !!!

0
Dimitar
Telerik team
answered on 20 Jul 2016, 08:25 AM
Hi,

Reviewing your RadGrid settings helped me identify the cause of the issue faced.
As the Prev/Next buttons are command items, you need to set the MasterTableView-CommandItemDisplay property to a value other than None. It is None by default. Set it to Top for example and the buttons will be available above your RadGrid.

Regards,
Dimitar
Telerik by Progress
Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
0
shashi
Top achievements
Rank 1
answered on 20 Jul 2016, 02:38 PM

Thanks !!!! Now I can see prev and next button but when I click on the next or previous button nothing happens.

in android tablet and mobile frozen column and static header are not working.

it just has a horizontal scroll bar which moves full data.

 

please help me to solve this issue.

 

0
shashi
Top achievements
Rank 1
answered on 20 Jul 2016, 02:58 PM

I just tested again it is working on android phone only issue is with iPad and iPhone.

 

Thanks !!!!

0
shashi
Top achievements
Rank 1
answered on 20 Jul 2016, 07:45 PM

Can I only show commanditem row for small or mobile view using cuss or jquery ?

 

0
shashi
Top achievements
Rank 1
answered on 22 Jul 2016, 04:38 PM

After making all changes its not working for IPad and iPhone .

its working fine in android phone and tablet .

please help me with it .

 

0
Dimitar
Telerik team
answered on 25 Jul 2016, 08:12 AM
Hello,

You may use the RadDeviceDetectionFramework, which would allow you to enable the command item row only on devices with small or medium screen size in code behind for example.
I am afraid that I cannot reproduce the reported behavior that the Prev/Next buttons do not work on iOS devices only. In order to assist you in the most efficient way I would suggest that you provide a very simplified runnable project that demonstrates the behavior that you describe. It may include aspx, code behind, web.config, dummy data source, as well as any other files you find necessary. Thus, we could test your exact scenario locally and determine what might be causing the issue that you are experiencing. You can find guidelines how to prepare such a sample in the Isolating a problem in a sample project blog post.

Regards,
Dimitar
Telerik by Progress
Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
0
shashi
Top achievements
Rank 1
answered on 11 Aug 2016, 07:24 PM

I am creating the solution , will post it here.

Can we use this feature in android phone/ tablet and use horizontal scroll in iPhone /iPad .

can I achieve this by using jquery if yes can you please guide me to implement this.

 

Thanks !!!!

0
shashi
Top achievements
Rank 1
answered on 11 Aug 2016, 08:34 PM

i have created the solution but where to upload it ?

I don't have a support ticket.

 

Thanks !!

0
Dimitar
Telerik team
answered on 12 Aug 2016, 01:21 PM
Hi,

I have contacted our team responsible for user licenses. They will contact you and will assist you with the process of license purchasing. After that you will have access to our support system.

Regards,
Dimitar
Telerik by Progress
Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
0
shashi
Top achievements
Rank 1
answered on 12 Aug 2016, 02:21 PM

I am using licensed telerik controls. It's not trial version it's corporate license.

what do I need to create a support ticket with it .please can you guide it.

 

thanks !!!

0
Dimo
Telerik team
answered on 17 Aug 2016, 08:44 AM
Hello Shashi,

Please ask the current license holder at your company to login at telerik.com and visit the following page:

https://www.telerik.com/account/manage-licensed-users

(The page is accessible from the "Your Account" page after clicking on "Products & Subscriptions".) 

There the license holder will be able to assign you as a licensed developer, and this will allow you to benefit from our support service and submit tickets with a 24h response time.

If you need help or have questions about the above procedure, please contact sales@telerik.com and we will readily assist.

Regards,
Dimo
Telerik by Progress
Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Tags
Grid
Asked by
Daniel
Top achievements
Rank 1
Answers by
Daniel
Telerik team
Jeremy
Top achievements
Rank 1
karthi
Top achievements
Rank 1
John Fetherolf
Top achievements
Rank 1
Isabelle
Top achievements
Rank 1
Dimitar
Telerik team
Prabhu
Top achievements
Rank 1
shashi
Top achievements
Rank 1
Dimo
Telerik team
Share this question
or