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

Why aren't my Row heights fixed

1 Answer 102 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Tim
Top achievements
Rank 1
Tim asked on 06 Feb 2012, 05:13 PM
Hi I have the following grid defined in my app

 

 

<telerik:RadGrid ID="ColumnRadGrid" runat="server"

 

 

 

AllowAutomaticUpdates="True"

 

 

 

AllowFilteringByColumn="false"

 

 

 

AllowMultiRowSelection="true"

 

 

 

AllowSorting="false"

 

 

 

AutoGenerateColumns="false"

 

 

 

ClientSettings-AllowColumnsReorder="false"

 

 

 

Height="100%"

 

 

 

OnItemCreated="ColumnRadGrid_ItemCreated"

 

 

 

OnItemDataBound="ColumnRadGrid_ItemDataBound"

 

 

 

OnItemUpdated="ColumnRadGrid_ItemUpdated"

 

 

 

OnNeedDataSource="ColumnRadGrid_NeedDataSource"

 

 

 

ShowHeader="true"

 

 

 

TabIndex="6"

 

 

 

Visible="True"

 

 

 

Width="100%">

 

 

 

<ClientSettings AllowKeyboardNavigation="true" EnableRowHoverStyle="false" >

 

 

 

<Selecting AllowRowSelect="True" />

 

 

 

<ClientEvents OnRowDblClick="ColumnRowDblClick" OnRowClick="ColumnRowClick"

 

 

 

OnGridCreated="GridCreated" OnCommand="GridCommand" />

 

 

 

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

 

 

 

</ClientSettings>

 

 

 

 

<MasterTableView BorderWidth="1" EditMode="InPlace" GridLines="Vertical" TableLayout="Fixed" Height="100%" Width="100%">

 

 

 

 

<Columns>

 

 

 

 

<telerik:GridTemplateColumn

 

 

 

HeaderText="Data Field"

 

 

 

HeaderTooltip="Data field name"

 

 

 

ItemStyle-Wrap="False"

 

 

 

UniqueName="columnName" ItemStyle-Height="25px">

 

 

 

<ItemTemplate>

 

 

 

<asp:Label ID="ColumnRadGridNameLabel" runat="server" Text='<%#HttpUtility.HtmlEncode(Eval("ColumnName")) %>' ClientIDMode="Static">

 

 

 

</asp:Label>

 

 

 

</ItemTemplate>

 

 

 

</telerik:GridTemplateColumn>

 

 

 

<telerik:GridTemplateColumn

 

 

 

HeaderText="Column Alias"

 

 

 

HeaderTooltip="Column alias"

 

 

 

ItemStyle-Wrap="False"

 

 

 

UniqueName="columnAlias" ItemStyle-Height="25px">

 

 

 

<ItemTemplate>

 

 

 

<asp:Label ID="ColumnRadGridAliasLabel" runat="server" Text='<%#HttpUtility.HtmlEncode(Eval("Alias")) %>' ClientIDMode="Static">

 

 

 

</asp:Label>

 

 

 

</ItemTemplate>

 

 

 

<EditItemTemplate>

 

 

 

<telerik:RadTextBox ID="ColumnRadGridAliasTextBox" runat="server"

 

 

 

ClientIDMode="Static"

 

 

 

Text='<%#HttpUtility.HtmlEncode(Eval("Alias"))%>'

 

 

 

Width="140px" MaxLength="128">

 

 

 

</telerik:RadTextBox>

 

 

 

</EditItemTemplate>

 

 

 

</telerik:GridTemplateColumn>

 

 

 

<telerik:GridTemplateColumn

 

 

 

HeaderStyle-Width="100px"

 

 

 

HeaderText="Show Option"

 

 

 

HeaderTooltip="Show options"

 

 

 

ItemStyle-Width="100px"

 

 

 

ItemStyle-Wrap="False"

 

 

 

UniqueName="showOption" ItemStyle-Height="25px">

 

 

 

<ItemTemplate>

 

 

 

<asp:Label ID="ColumnRadGridShowLabel" runat="server" Text='<%#HttpUtility.HtmlEncode(Eval("ShowText")) %>' ClientIDMode="Static">

 

 

 

</asp:Label>

 

 

 

</ItemTemplate>

 

 

 

<EditItemTemplate>

 

 

 

<telerik:RadComboBox ID="ColumnRadGridShowComboBox" runat="server" ClientIDMode="Static" Width="90px">

 

 

 

</telerik:RadComboBox>

 

 

 

</EditItemTemplate>

 

 

 

</telerik:GridTemplateColumn>

 

 

 

<telerik:GridTemplateColumn

 

 

 

HeaderStyle-Width="130px"

 

 

 

HeaderText="Sort Option"

 

 

 

HeaderTooltip="Sort options"

 

 

 

ItemStyle-Width="130px"

 

 

 

ItemStyle-Wrap="False"

 

 

 

UniqueName="sortOption" ItemStyle-Height="25px">

 

 

 

<ItemTemplate>

 

 

 

<asp:Label ID="ColumnRadGridSortLabel" runat="server" Text='<%#HttpUtility.HtmlEncode(Eval("SortText")) %>' ClientIDMode="Static">

 

 

 

</asp:Label>

 

 

 

</ItemTemplate>

 

 

 

<EditItemTemplate>

 

 

 

<telerik:RadComboBox ID="ColumnRadGridSortComboBox" runat="server" ClientIDMode="Static"

 

 

 

OnClientSelectedIndexChanged="SortSelectionChanged"

 

 

 

Width="120px">

 

 

 

</telerik:RadComboBox>

 

 

 

</EditItemTemplate>

 

 

 

</telerik:GridTemplateColumn>

 

 

 

<telerik:GridTemplateColumn

 

 

 

HeaderStyle-Width="135px"

 

 

 

HeaderText="Sort Order"

 

 

 

HeaderTooltip="Sort priority"

 

 

 

ItemStyle-Width="135px"

 

 

 

ItemStyle-Wrap="False"

 

 

 

UniqueName="sortOrder" ItemStyle-Height="25px">

 

 

 

<ItemTemplate>

 

 

 

<asp:Label ID="ColumnRadGridSortOrderLabel" runat="server" Text='<%#HttpUtility.HtmlEncode(Eval("SortOrderText")) %>' ClientIDMode="Static">

 

 

 

</asp:Label>

 

 

 

</ItemTemplate>

 

 

 

<EditItemTemplate>

 

 

 

<telerik:RadNumericTextBox ID="ColumnRadGridSortOrderNumericTextBox" runat="server"

 

 

 

ClientIDMode="Static" Width="100px" MinValue="1" MaxValue="1" ShowSpinButtons="True" NumberFormat-DecimalDigits="0" Value="1">

 

 

 

</telerik:RadNumericTextBox>

 

 

 

</EditItemTemplate>

 

 

 

</telerik:GridTemplateColumn>

 

 

 

</Columns>

 

 

 

</MasterTableView>

 

 

 

</telerik:RadGrid>

When I supply data the row heights change as I add items.

The first item occupies the entire height availalbe.

The second add makes the two rows take 50%.

Three a third etc until I reach four or five. Then the size is constant.

What am I missing?

 

1 Answer, 1 is accepted

Sort by
0
Tim
Top achievements
Rank 1
answered on 06 Feb 2012, 06:32 PM
OK Problem solved.

Part of the proble, maybe all of it was caused by setting the MasterTableView height attribute to 100%.

In addition to removing this I added some style overrides by adding the

<

 

 

ItemStyle CssClass="Row20" /> block to the MasterTableView

and adding the following style block

 

 

 

<style type="text/css">

 

 

 

 

/* The following style overrides appear to be necessary to

 

prevent the rows from being a variable height in my grids.*/

 

 

.RadGrid tr.Row20

 

{

 

 

/*background:yellow;*/

 

}

 

 

 

.RadGrid .Row20 td

 

{

 

 

margin:0;

 

 

 

padding-top:0;

 

 

 

padding-bottom:0;

 

 

 

height:20px;

 

}

 

 

 

</style>

NOTE!! I commented the tr.Row20 setting, but I am including it here as extra info.

HTH 

 

Tags
Grid
Asked by
Tim
Top achievements
Rank 1
Answers by
Tim
Top achievements
Rank 1
Share this question
or