Stuart Hemming
Top achievements
Rank 2
Rank 2
Stuart Hemming
asked on 29 Jan 2011, 12:06 PM
Using this markup...
open the page in IE8. Expand a row. See the button. Scroll the grid and see the button scroll.
Now do the same thing in IE7/IE8+Compatability mode. The button doesn't scroll. I suspect that this may be related to this issue but im unsure how I might go about solving it in this case.
Any pointers would be appreciated.
--
Stuart
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1.Default" %><%@ 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"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> </telerik:RadScriptManager> <div> <telerik:RadGrid ID="RadGrid1" runat="server" GridLines="None" DataSourceID="SQLData"> <MasterTableView AutoGenerateColumns="false"> <ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column"> <HeaderStyle Width="20px"></HeaderStyle> </ExpandCollapseColumn> <Columns> <telerik:GridBoundColumn UniqueName="ID" DataField="ProductID" HeaderText="ID" /> <telerik:GridBoundColumn UniqueName="Name" DataField="Name" HeaderText="Name" /> </Columns> <NestedViewTemplate> <asp:Label runat="server" ID="lblProductNumber" Text='<%#Eval("ProductNumber")%>' /> <telerik:RadButton runat="server" ID="btn" Text="Alarm" Icon-PrimaryIconUrl="~/Images/alarm-clock.png" /> </NestedViewTemplate> </MasterTableView> <ClientSettings Scrolling-UseStaticHeaders="true" Scrolling-AllowScroll="true" /> </telerik:RadGrid> <asp:SqlDataSource runat="server" ID="SQLData" ConnectionString="<%$ ConnectionStrings:AdventureWorksConnectionString2 %>" SelectCommand="SELECT * FROM [Production].[Product]"/> </div> </form> </body></html>open the page in IE8. Expand a row. See the button. Scroll the grid and see the button scroll.
Now do the same thing in IE7/IE8+Compatability mode. The button doesn't scroll. I suspect that this may be related to this issue but im unsure how I might go about solving it in this case.
Any pointers would be appreciated.
--
Stuart
6 Answers, 1 is accepted
0
Cori
Top achievements
Rank 2
Rank 2
answered on 31 Jan 2011, 02:53 PM
Hello Stuart,
I had the same situation with the RadTreeList control, when I enabled scrolling, the RadButtons would not scroll. The thing that solved it was setting position:relative on the RadTreeList and the RadButtons began to scroll, instead of remaining fixed on the page.
I'm guessing the same fix would work for the RadGrid, since when I examine the the RadGrid using the IE Developer Tool, the default position is set to static.
I hope that helps.
I had the same situation with the RadTreeList control, when I enabled scrolling, the RadButtons would not scroll. The thing that solved it was setting position:relative on the RadTreeList and the RadButtons began to scroll, instead of remaining fixed on the page.
I'm guessing the same fix would work for the RadGrid, since when I examine the the RadGrid using the IE Developer Tool, the default position is set to static.
I hope that helps.
0
Hello Stuart,
This is a known issue of the control, and it is explained in the following help article: http://www.telerik.com/help/aspnet-ajax/radbutton-known-issues-ie6-ie7.html.
Kind regards,
Pero
the Telerik team
This is a known issue of the control, and it is explained in the following help article: http://www.telerik.com/help/aspnet-ajax/radbutton-known-issues-ie6-ie7.html.
Kind regards,
Pero
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
Stuart Hemming
Top achievements
Rank 2
Rank 2
answered on 31 Jan 2011, 03:27 PM
@Cori: Setting the grid to position:relative makes no difference.
@Pero: You have simply supplied me with a link to the article that I referred to in my original post. And that fix doesn't appear to work.
--
Stuart
@Pero: You have simply supplied me with a link to the article that I referred to in my original post. And that fix doesn't appear to work.
--
Stuart
0
Accepted
Hi Stuart,
Please excuse me, I didn't notice the link. I tested your code and setting position: relative to the <div/> containing the RadGrid's data seems to resolve the issue. Here is the modified code:
Best wishes,
Pero
the Telerik team
Please excuse me, I didn't notice the link. I tested your code and setting position: relative to the <div/> containing the RadGrid's data seems to resolve the issue. Here is the modified code:
<%@ 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"><head id="Head1" runat="server"> <title></title> <style type="text/css"> /* IE7 */ * + html .RadGrid .rgDataDiv { position: relative; } /* IE6 */ *html .RadGrid .rgDataDiv { position: relative; } </style></head><body> <form id="form1" runat="server"> <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> </telerik:RadScriptManager> <div> <telerik:RadGrid ID="RadGrid1" runat="server" GridLines="None" OnNeedDataSource="RadGrid1_NeedDataSource"> <MasterTableView AutoGenerateColumns="false"> <ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column"> <HeaderStyle Width="20px"></HeaderStyle> </ExpandCollapseColumn> <Columns> <telerik:GridBoundColumn UniqueName="ID" DataField="ProductID" HeaderText="ID" /> <telerik:GridBoundColumn UniqueName="Name" DataField="Name" HeaderText="Name" /> </Columns> <NestedViewTemplate> <asp:Label runat="server" ID="lblProductNumber" Text='Grid Label - Product Number' /> <telerik:RadButton runat="server" ID="btn" Text="Alarm" /> </NestedViewTemplate> </MasterTableView> <ClientSettings Scrolling-UseStaticHeaders="true" Scrolling-AllowScroll="true" /> </telerik:RadGrid> </div> </form></body></html>Best wishes,
Pero
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
Stuart Hemming
Top achievements
Rank 2
Rank 2
answered on 31 Jan 2011, 04:10 PM
Pero,
Nice one.
I was setting the prosition:relative on the wrong bit.
That works a treat in IE8+compatability mode. I'll get my colleagues to check it out in IE6/7.
--
Stuart
Nice one.
I was setting the prosition:relative on the wrong bit.
That works a treat in IE8+compatability mode. I'll get my colleagues to check it out in IE6/7.
--
Stuart
0
Stuart Hemming
Top achievements
Rank 2
Rank 2
answered on 31 Jan 2011, 07:56 PM
Works in IE6/7 too.
Cool.
--
Stuart
Cool.
--
Stuart