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

Grid Scrolling not working in Firefox

4 Answers 73 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Het
Top achievements
Rank 1
Het asked on 20 Aug 2008, 09:30 PM

I am using RadGrid, and I have set all the relevant properties in order to enable scrolling, still it is rendering properly in IE 7 and grid comes in compressed form, where in I can barely see the half header. Interesting thing is, initially grid is visible to its full, but after sometime its height is reduced.

Below is the code.

<

telerik:RadGrid ID="gd" runat="server" AllowPaging="false" AllowSorting="True" GridLines="None"

Skin="Office2007" AutoGenerateColumns="False" OnItemDataBound="gd_ItemDataBound"

Height="99%" Width="99%" AllowMultiRowSelection="true" ShowGroupPanel="true"

EnableViewState="true" AlternatingItemStyle-BackColor="#eeeeee" HorizontalAlign="NotSet">

<

MasterTableView GroupLoadMode="Client" GroupsDefaultExpanded="true" TableLayout="Auto">

<

GroupByExpressions>

<telerik:GridGroupByExpression>

<SelectFields>

<telerik:GridGroupByField FieldName="Desc" HeaderText=" " HeaderValueSeparator=" " />

</SelectFields>

<GroupByFields>

<telerik:GridGroupByField FieldName="Id" SortOrder="Descending" />

</GroupByFields>

</telerik:GridGroupByExpression>

</GroupByExpressions>

<

RowIndicatorColumn Visible="False">

<HeaderStyle Width="20px" />

</RowIndicatorColumn>

<ExpandCollapseColumn Resizable="False" Visible="False">

<HeaderStyle Width="20px" />

</ExpandCollapseColumn>

<Columns>

<telerik:GridTemplateColumn HeaderText="Column#" ItemStyle-Width="15%" HeaderStyle-Width="15%"

ItemStyle-VerticalAlign="Top" ShowSortIcon="true" SortAscImageUrl="../MyAircraft/Images/SortAsc.gif"

SortDescImageUrl="../MyAircraft/Images/SortDesc.gif" SortExpression="ColNbr">

<ItemTemplate>

<asp:Label ID="lblColNbr" runat="server"></asp:Label>

</

ItemTemplate>

<ItemStyle VerticalAlign="Top" Width="10%"/>

</telerik:GridTemplateColumn>

</

Columns>

<

EditFormSettings>

<PopUpSettings ScrollBars="None" />

</EditFormSettings>

</MasterTableView>

<ItemStyle Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False"

Font-Underline="False" VerticalAlign="Top" Wrap="True" Height="100%" Width="100%" />

<ClientSettings AllowColumnsReorder="True" ReorderColumnsOnClient="True" AllowKeyboardNavigation="true">

<Selecting AllowRowSelect="True" EnableDragToSelectRows="true" />

<Scrolling AllowScroll="true" UseStaticHeaders="true" />

<Resizing AllowColumnResize="True" ResizeGridOnColumnResize="True" EnableRealTimeResize="True"

ClipCellContentOnResize="true"></Resizing>

</ClientSettings>

</telerik:RadGrid>



I am populating the grid at runtime, and values of the lblColnbr is set in gd_ItemDataBound.

There are few more columns with label and text box, as it will increase the size of the text, i am not including those.

Please let me know if I have missed anything here.

Thanks,
Het



4 Answers, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 21 Aug 2008, 01:21 PM
Hello Het,

According to the way CSS and browsers work, when a web element (RadGrid in your case) has its height defined in percent, its parent element should have a height defined as well. If the height of the parent element is also in percent, the rule applies recursively.

Let us know if you need more information.

All the best,
Dimo
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Het
Top achievements
Rank 1
answered on 21 Aug 2008, 01:51 PM
Thanks Dimo for the reply.

Yes, I guessed the same. In my case I have my RadGrid as below.

<

telerik:RadSplitter ID="StatusSplitter" runat="server" Skin="Default" Width="100%" ResizeWithParentPane="true" Height="100%" Orientation="Horizontal" VisibleDuringInit="false" ResizeWithBrowserWindow="true">
<telerik:RadPane ID="RadPane1" runat="server" Height="100%" Scrolling="None">
<telerik:RadGrid ID="gd" runat="server" AllowPaging="false" AllowSorting="True" GridLines="None" Skin="Telerik" AutoGenerateColumns="False".....


and so on.... RadSplitter is inside form tag.

But still its not showing up completely as desired.

Thanks,
Het





0
Dimo
Telerik team
answered on 21 Aug 2008, 02:31 PM
Hi Het,

Here is a working example of your scenario:

RadGrid with 100% Height

You may also want to check this out:

How to Set 100% Height to RadAjaxManager Update Panel


Both examples contain a RadSplitter with a RadGrid inside.


Best wishes,
Dimo
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Vargis
Top achievements
Rank 1
answered on 20 Sep 2012, 06:19 AM
So horrible ...Y team Telerick you are taking with Height it all about Scroll ..right
I am also facing with the same ...Ragrid Height is in 100%

In all execpt one RadGrid Scroll Horz and Vertical is working.
Only difference i had found  in that Radgris is

<ClientSettings>
<Scrolling AllowScroll="true" />
</ClientSettings>

is added. Wats a mad ?!
Tags
Grid
Asked by
Het
Top achievements
Rank 1
Answers by
Dimo
Telerik team
Het
Top achievements
Rank 1
Vargis
Top achievements
Rank 1
Share this question
or