Hi,
I have a page with a RadSplitter taking 100% height and width. Inside this I have two RadPanes (vertical) correctly fitting the page.
If I put a RadGrid with a number of records that would exceed the page height inside one of the two panes it happens that the RadGrid is correctly represented inside the pane with vertical scroll bar that is correctly contained inside the RadPane, but the page gets an additional vertical scroll bar that would scroll the page to all the height of the table...which is not shown ! (Two screen shots are attached).
This behavior shows up in IE, Firefox, Safari, ect....so it is not browser dependent.
I've tried many...adjustments including adjusting ScrollHeight but without any change in the behavior of the page.
Help !
Thanks a lot as always.
9 Answers, 1 is accepted
0
Lorenzo
Top achievements
Rank 1
Rank 1
answered on 20 Mar 2010, 04:28 PM
Hi,
in the header.
I've kind of solved the problem although I'm not all the way sure this solution won't have consequences on the rest of my application...
Well the solution for me has been just setting
| <style type="text/css"> |
| html |
| { |
| overflow:hidden; |
| } |
| </style> |
Hope this can help somebody !
Lorenzo
0
Samuel Davis
Top achievements
Rank 1
Rank 1
answered on 31 Mar 2010, 09:08 PM
Haha yeah that def doesnt work too well if you have a long page, it stops the whole page from scrolling, I actually have the very same problem if any solution has been found to this.
0
Hi Samuel,
I am afraid the Lorenzo's screenshots do not provide a definite hint what the problem is, so if you believe that you have the same situation, please provide a simple web page.
There is a similar problem, but it occurs in IE only, when you have the RadGrid pager displayed - the pager contains relatively positioned elements (RadComboBox or RadSlider), which creates problems with scrollable containers. The solution is to set position:relative style to the scrollable container. In this case - set a custom CSS class to the RadPane and add the style to that CSS class.
Best wishes,
Dimo
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
I am afraid the Lorenzo's screenshots do not provide a definite hint what the problem is, so if you believe that you have the same situation, please provide a simple web page.
There is a similar problem, but it occurs in IE only, when you have the RadGrid pager displayed - the pager contains relatively positioned elements (RadComboBox or RadSlider), which creates problems with scrollable containers. The solution is to set position:relative style to the scrollable container. In this case - set a custom CSS class to the RadPane and add the style to that CSS class.
Best wishes,
Dimo
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Lorenzo
Top achievements
Rank 1
Rank 1
answered on 01 Apr 2010, 01:33 PM
Hi, sorry I didn't provide a working sample, I gues my "explanation" resulted a bit poor !
Following a sample page with my "achievements" ;-)
test2.aspx
| <!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>Test Page</title> |
| <style type="text/css"> |
| HTML, FORM, BODY, DIV#Container |
| { |
| height:100%; |
| border:0px; |
| margin:0px; |
| } |
| HTML |
| { |
| overflow:hidden; |
| } |
| </style> |
| </head> |
| <body> |
| <form id="form1" runat="server"> |
| <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> |
| </telerik:RadScriptManager> |
| <div id="Container"> |
| <telerik:RadSplitter ID="RadSplitter1" runat="server" Width="100%" Height="100%" Orientation="Vertical"> |
| <telerik:RadPane ID="RadPane1" runat="server" Width="300px" Height="100%"> |
| </telerik:RadPane> |
| <telerik:RadSplitBar ID="RadSplitBar1" runat="server"> |
| </telerik:RadSplitBar> |
| <telerik:RadPane ID="RadPane2" runat="server" Width="100%" Height="100%"> |
| <telerik:RadGrid ID="RadGrid" runat="server" GridLines="None" Height="100%"> |
| <HeaderContextMenu EnableAutoScroll="True"> |
| </HeaderContextMenu> |
| <MasterTableView> |
| <RowIndicatorColumn> |
| <HeaderStyle Width="20px" /> |
| </RowIndicatorColumn> |
| <ExpandCollapseColumn> |
| <HeaderStyle Width="20px" /> |
| </ExpandCollapseColumn> |
| </MasterTableView> |
| </telerik:RadGrid> |
| </telerik:RadPane> |
| </telerik:RadSplitter> |
| </div> |
| </form> |
| </body> |
| </html> |
and a fake datasource...
test2.aspx.vb
| Partial Class test2 |
| Inherits System.Web.UI.Page |
| Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load |
| Dim oTab As New Data.DataTable |
| oTab.Columns.Add(New Data.DataColumn("Id", GetType(Integer))) |
| oTab.Columns.Add(New Data.DataColumn("Name", GetType(String))) |
| For i As Integer = 0 To 100 |
| Dim oRow As Data.DataRow = oTab.NewRow |
| oRow("Id") = i |
| oRow("Name") = "RowName_" & i |
| oTab.Rows.Add(oRow) |
| Next |
| RadGrid.DataSource = oTab |
| RadGrid.DataBind() |
| End Sub |
| End Class |
hope this helps !
Lorenzo
0
Samuel Davis
Top achievements
Rank 1
Rank 1
answered on 01 Apr 2010, 06:43 PM
I have added some pictures that attempt to explain it better. Basically the problem is that lets say for ease of explanation.
I have a page thats 300px high, and a radgrid thats set to a scrollable height of 200px.
If I pull a lot of records on my grid, its contents could be 400px in height (though still the radgrid itself is 200 and has not changed)
The problem is that because of the 400px height of the scrollable content, now my page has become 400px, even though it is designed to only be 300px, thus adding lots of whitespace at the end and defeating the point of making the radgrid itself scrollable.
Your response seems like it might be the same problem I am facing. I checked and mine only occurs in IE like you said. I dont have any radpane on my page though. Where should I provide the position: relative Css that you provided?
Thanks for your time, if the pictures and explanation do not work I can provide you sample code.
0
Lorenzo,
I don't reproduce the described problem with your sample page - I see only one scrollbar - that of the RadPane.
Samuel,
Please set the position:relative style to the scrollable container, whatever it is. In your case it is probably the RadGrid data container:
.rgDataDiv
{
position:relative;
}
Sincerely yours,
Dimo
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
I don't reproduce the described problem with your sample page - I see only one scrollbar - that of the RadPane.
Samuel,
Please set the position:relative style to the scrollable container, whatever it is. In your case it is probably the RadGrid data container:
.rgDataDiv
{
position:relative;
}
Sincerely yours,
Dimo
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Lorenzo
Top achievements
Rank 1
Rank 1
answered on 02 Apr 2010, 09:54 AM
Hi Dimo,
I don't have any problem, I was just showing to Samuel ho I got rid of my problem ! Things for me are smooth as silk.
Thanks !
Lorenzo
0
Samuel Davis
Top achievements
Rank 1
Rank 1
answered on 02 Apr 2010, 03:27 PM
Dimo, thanks that worked and was an easy change!
Lorenzo, thanks for checking back and taking the time to post your code
0
Irwin
Top achievements
Rank 1
Rank 1
answered on 11 May 2012, 11:58 PM
Thank you very much Lorenzo.
I had the same problem: right scrolling appears in the page because the radgrid has many records even they don't appear in screen (actually I'm using paging ). Your solution save my life.
Sincerely,
Irwin
I had the same problem: right scrolling appears in the page because the radgrid has many records even they don't appear in screen (actually I'm using paging ). Your solution save my life.
Sincerely,
Irwin