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

RadGrid AllowScroll with FrozenColumn make last column partially hide

5 Answers 211 Views

Grid

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

guillaume.lebel asked on 27 Oct 2010, 07:43 PM

gridscroll.jpg

Hi,

I have grid that contains many different column. Also i have activate the scroll and set the frozencolumncount to 3.

The thing is that my last column is not showing completly. I have to create an empty column visible="false" and set a specific with to be able to see my last column completly. (see attachment)

Here is my grid html code :

<telerik:RadGrid ID="RadGridCadetStaffing" runat="server" AutoGenerateColumns="False"

Style="margin-top: 5px;" AllowSorting="true" AllowFilteringByColumn="true" AllowMultiRowSelection="true"

meta:resourcekey="RadGridCadetStaffing" OnItemCreated="OnItemCreated" OnNeedDataSource="OnNeedDataSource" AllowPaging="true" EnableViewState="true">

<MasterTableView TableLayout="Fixed" CommandItemDisplay="TopAndBottom" AutoGenerateColumns="false">

<CommandItemTemplate>

<asp:Panel ID="GridFooter" CssClass="ListFooter" runat="server" HorizontalAlign="Right">

<fortress:ButtonAddNew ID="ButtonAddNew" runat="server"></fortress:ButtonAddNew>

<asp:ImageButton ID="ImageButtonSubmitCadetApplication" runat="server" OnClick="OnSubmitCadetApplication" style="margin-right:10px"

ImageUrl="~/App_Themes/Fv2Default/StandardButtons/SubmitCommit20x20.png" meta:resourcekey="ImageButtonSubmitCadetApplication" />

<asp:ImageButton ID="ImageButtonDeleteCadetApplication" runat="server" OnClick="OnDeleteSelected"

ImageUrl="$/grid/Delete20x20.png" AlternateText="~Supprimer une application"

meta:resourcekey="ImageButtonDeleteCadetApplication" />

</asp:Panel>

</CommandItemTemplate>

<Columns>

<telerik:GridClientSelectColumn Reorderable="False" UniqueName="ClientSelectColumn"

HeaderText="~Sélection" meta:resourcekey="GridClientSelectColumn">

<HeaderStyle Width="20px"></HeaderStyle>

</telerik:GridClientSelectColumn>

<%--Insérez vos colonnes ici -- DÉBUT --%>

<telerik:GridTemplateColumn UniqueName="TemplateEditColumn" AllowFiltering="false">

<ItemTemplate>

<fortress:ButtonEdit ID="ButtonEdit" runat="server">

</fortress:ButtonEdit>

</ItemTemplate>

<HeaderStyle Width="30px" />

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn AllowFiltering="true" UniqueName="CadetId" Visible="false">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn AllowFiltering="true" UniqueName="StaffableActivityContingentId"

Visible="false" HeaderText="~StaffableActivityContingentId">

</telerik:GridBoundColumn>

<fortress:RadGridDateColumn UniqueName="WaiverCount" Visible="false">

</fortress:RadGridDateColumn>

<telerik:GridTemplateColumn AllowFiltering="false" ItemStyle-HorizontalAlign="Center"

UniqueName="WaiverCountImage" meta:resourcekey="GridTemplateColumnWaiverCount"

SortExpression="ApplicationStatus">

<HeaderStyle Width="25px" HorizontalAlign="Center" />

<ItemTemplate>

<asp:Image ID="ImageRespectAllCriteria" runat="server" Visible='<%#EvalIsIncomplete(Eval(LocalizedCadetStaffingFieldsName.ApplicationStatusId))%>'

ImageUrl='~/App_Themes/Fv2Default/StandardButtons/Warning20x20.png' meta:resourcekey="ImageRespectAllCriteria" />

<asp:Image ID="ImageRejected" runat="server" Visible='<%#EvalIsRejected(Eval(LocalizedCadetStaffingFieldsName.ApplicationStatusId))%>'

ImageUrl='~/App_Themes/Fv2Default/StandardButtons/Error20x20.png' meta:resourcekey="ImageImageRejected" />

<asp:Label ID="LabelRespectAllCriteria" runat="server"

Visible='<%# !EvalIsIncomplete(Eval(LocalizedCadetStaffingFieldsName.ApplicationStatusId)) && !EvalIsRejected(Eval(LocalizedCadetStaffingFieldsName.ApplicationStatusId)) %>'

Text=" "></asp:Label>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn AllowFiltering="true" UniqueName="ApplicationStatus" HeaderText="~ApplicationStatus"

meta:resourcekey="GridBoundColumnApplicationStatus">

<HeaderStyle Width="110px" />

</telerik:GridBoundColumn>

<telerik:GridTemplateColumn UniqueName="ApplicationDerogationStatus" HeaderText="~Dérogation" AllowFiltering="false"

meta:resourcekey="TemplateColumnApplicationDerogationStatus">

<HeaderStyle Width="30px" HorizontalAlign="Center" />

<ItemStyle HorizontalAlign="Center" />

<ItemTemplate>

<asp:Label ID="LabelEmptyDerogation" runat="server" Text=" "

Visible='<%# !EvalApplicationDerogationStatus(Eval(LocalizedCadetStaffingFieldsName.ApplicationStatusId), Eval(LocalizedCadetStaffingFieldsName.WaiverCount))%>'></

asp:Label>

<asp:Image ID="ImageDerogation" runat="server" ImageUrl="~/App_Themes/Fv2Default/StandardButtons/CheckWaiver20x20.png"

Visible='<%# EvalApplicationDerogationStatus(Eval(LocalizedCadetStaffingFieldsName.ApplicationStatusId), Eval(LocalizedCadetStaffingFieldsName.WaiverCount))%>' meta:resourcekey="ImageDerogation" />

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridHyperLinkColumn AllowFiltering="true" UniqueName="ContingentSerialNumber" HeaderText="~ContingentSerialNumber"

DataNavigateUrlFormatString="~/Content/StaffableActivities/Contingent/UnitStaffableActivityContingentView.aspx?ContingentId={0}"

DataNavigateUrlFields="StaffableActivityContingentId" meta:resourcekey="GridBoundColumnContingentSerialNumber">

<HeaderStyle Width="70px" />

</telerik:GridHyperLinkColumn>

<telerik:GridBoundColumn AllowFiltering="true" UniqueName="Name" HeaderText="~name"

meta:resourcekey="GridBoundColumnName">

<HeaderStyle Width="80px" />

</telerik:GridBoundColumn>

<fortress:StaffableActivityTypeColumn UniqueName="StaffableActivityType">

</fortress:StaffableActivityTypeColumn>

<telerik:GridBoundColumn AllowFiltering="true" UniqueName="Nic" HeaderText="~Nic"

meta:resourcekey="GridBoundColumnNic">

<HeaderStyle Width="70px" />

</telerik:GridBoundColumn>

<telerik:GridHyperLinkColumn AllowFiltering="true" UniqueName="LastName" HeaderText="~LastName"

DataNavigateUrlFormatString="~/Content/Cadet/CadetView.aspx?CadetId={0}"

DataNavigateUrlFields="CadetId" meta:resourcekey="GridBoundColumnLastName">

<HeaderStyle Width="100px" />

</telerik:GridHyperLinkColumn>

<telerik:GridBoundColumn AllowFiltering="true" UniqueName="FirstName" HeaderText="~Prénom"

meta:resourcekey="GridBoundColumnFirstName">

<HeaderStyle Width="100px" />

</telerik:GridBoundColumn>

<%--Package de CadetRankColumn--%>

<fortress:CadetRankColumn>

</fortress:CadetRankColumn>

<telerik:GridBoundColumn UniqueName="CadetRankSequence" Visible="false">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn UniqueName="CadetRankId" Visible="false">

</telerik:GridBoundColumn>

<%-- Fin package de CadetRankColumn--%>

<telerik:GridBoundColumn UniqueName="SubmittedUnitShortName" HeaderText="~Saisi par" meta:resourcekey="GridBoundColumnSubmittedUnitShortName">

<HeaderStyle Width="80px" />

</telerik:GridBoundColumn>

<Fortress:RadGridDateColumn UniqueName="SubmissionDate" DataFormatString="{0:yyyy-MM-dd}" meta:resourcekey="GridBoundColumnSubmissionDate">

<HeaderStyle Width="80px" />

</Fortress:RadGridDateColumn>

<telerik:GridBoundColumn UniqueName="SubmissionStatus" meta:resourcekey="GridBoundColumnSubmissionStatus">

<HeaderStyle Width="110px" />

</telerik:GridBoundColumn>

<telerik:GridHyperLinkColumn AllowFiltering="true" UniqueName="UnitShortName" HeaderText="~UnitShortName"

DataNavigateUrlFormatString="~/Content/Unit/UnitView.aspx?UnitId={0}"

DataNavigateUrlFields="CadetCorpsId" meta:resourcekey="GridBoundColumnUnitShortName">

<HeaderStyle Width="70px" />

</telerik:GridHyperLinkColumn>

<fortress:RadGridDateColumn AllowFiltering="false" UniqueName="ContingentStartDate"

HeaderText="~ContingentStartDate" DataFormatString="{0:d}" meta:resourcekey="GridBoundColumnContingentStartDate">

<HeaderStyle Width="80px" />

</fortress:RadGridDateColumn>

<fortress:RadGridDateColumn AllowFiltering="false" UniqueName="ContingentEndDate"

HeaderText="~ContingentEndDate" DataFormatString="{0:d}" meta:resourcekey="GridBoundColumnContingentEndDate">

<HeaderStyle Width="80px" />

</fortress:RadGridDateColumn>

<fortress:RadGridDateColumn AllowFiltering="true" UniqueName="StartApplicationDate"

HeaderText="~StartApplicationDate" DataFormatString="{0:d}" meta:resourcekey="GridBoundColumnStartApplicationDate">

<HeaderStyle Width="90px" />

</fortress:RadGridDateColumn>

<fortress:RadGridDateColumn AllowFiltering="true" UniqueName="EndApplicationDate"

HeaderText="~EndApplicationDate" DataFormatString="{0:d}" meta:resourcekey="GridBoundColumnEndApplicationDate">

<HeaderStyle Width="90px" />

</fortress:RadGridDateColumn>

<telerik:GridBoundColumn AllowFiltering="false" UniqueName="CommandingOfficerPriority"

HeaderText="~Priorité du commandant" meta:resourcekey="GridBoundColumnCommandingOfficerPriority">

<HeaderStyle Width="80px" />

</telerik:GridBoundColumn>

<telerik:GridBoundColumn AllowFiltering="false" UniqueName="CadetPreference" HeaderText="~Préférence du cadet"

meta:resourcekey="GridBoundColumnCadetPreference">

<HeaderStyle Width="80px" />

</telerik:GridBoundColumn>

<%-- Cette colonne permet de régler le problème de scroll horizontal --%>

<fortress:RadGridDateColumn AllowFiltering="false" UniqueName="EmptyColumn">

<HeaderStyle Width="217px" />

</fortress:RadGridDateColumn>

<%--Insérez vos colonnes ici -- FIN --%>

</Columns>

</MasterTableView>

<ClientSettings>

<Scrolling AllowScroll="true" UseStaticHeaders="true" ScrollHeight="360px" FrozenColumnsCount="3" />

</ClientSettings>

</telerik:RadGrid>

The <fortress.... > are home made gridboundcolumn.

Is there a way to remove the last column that only serve to resize correctly my grid?

Thx for your help,
have a nice day,
Guillaume

5 Answers, 1 is accepted

answered on 28 Oct 2010, 02:23 PM

Hi Guillaume,

When using frozen columns, you have to ensure that the sum of the widths of the last visible columns matches (or is smaller than) the free space for non-frozen columns. Otherwise you will not see the last column completely.

Try changing the column widths. Alternatively, increase the width of the last column so that it is still clipped, but all of its content is visible.

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

answered on 29 Jan 2016, 02:42 PM

capture.png

The grid columns are being dynamically generated form an XML file. However, below is the declaration of the grid. Also to update you, the issue is only on a button click or any other postback event on the page. The grid columns look good when scrolled on Page Load. I have over 60 columns on the grid and attached is a screenshot of what happens.

<telerik:RadAjaxPanel ID="RadAjaxPanelGrid" runat="server" LoadingPanelID="RadAjaxLoadingGrid">
<telerik:RadPanelBar ID="RadPanelBarMain" runat="server" PersistStateInCookie="true"
CssClass="gridpanelNoCollapse">
<Items>
<telerik:RadPanelItem Text="Company: ALL Book: ALL" CssClass="collapsed" Expanded="true"
Selected="true" ToolTip="Click here to open and close the list" PreventCollapse="true">
<HeaderTemplate>
<table width="70%">
<tr>
<td class="span-label-left">
<span>
<asp:Label runat="server" ID="lblCompany" CssClass="span-label-text"></asp:Label></span>
</td>
<td class="span-label-right">
<span>
<asp:Label runat="server" ID="lblBook" CssClass="span-label-text"></asp:Label></span>
</td>
</tr>
</table>
</HeaderTemplate>
<ContentTemplate>
<telerik:RadTabStrip ID="TabStripDetailData" runat="server" MultiPageID="RadTabExpandCollapse"
SelectedIndex="0">
<Tabs>
<telerik:RadTab Text="Gold Detail">
</telerik:RadTab>
<telerik:RadTab Text="Company By Book">
</telerik:RadTab>
</Tabs>
</telerik:RadTabStrip>
<telerik:RadMultiPage ID="RadTabExpandCollapse" runat="server" SelectedIndex="0">
<telerik:RadPageView ID="RadPageCollapse" runat="server">
<twControl:TwRadGridDrc runat="server" ID="gridGoldSummary" OnNeedDataSource="gridGoldSummary_NeedDataSource"
OnItemCommand="gridGoldSummary_ItemCommand" GroupingEnabled="false" AllowFilteringByColumn="true"
AllowSorting="True" AutoGenerateColumns="false" AllowPaging="true" PageSize="50"
FeatureGroupID="Gold Detail" GridLines="None" ShowStatusBar="true" EnableHeaderContextMenu="false"
EnableHeaderContextFilterMenu="false" EnableViewState="false" ToolTip="Gold Detail"
Visible="true">
<GroupingSettings CaseSensitive="false" />
<MasterTableView Visible="true" TableLayout="Fixed" IsFilterItemExpanded="true" CommandItemDisplay="None">
<CommandItemSettings ShowExportToWordButton="false" ShowExportToExcelButton="false"
ShowRefreshButton="false" ShowExportToCsvButton="false" ShowExportToPdfButton="false"
ShowAddNewRecordButton="false"></CommandItemSettings>

<Columns></Columns>
</MasterTableView>
<ClientSettings AllowColumnHide="false" ReorderColumnsOnClient="false" ColumnsReorderMethod="Reorder"
AllowColumnsReorder="false">
<Scrolling FrozenColumnsCount="2" AllowScroll="true" UseStaticHeaders="true"/>
<Resizing AllowColumnResize="false" AllowRowResize="false" />
</ClientSettings>
<PagerStyle AlwaysVisible="true" PageSizeControlType="None" />
</twControl:TwRadGridDrc>
</telerik:RadPageView>
<telerik:RadPageView ID="RadPageExpand" runat="server">
<twControl:TwRadGridDrc runat="server" ID="gridGoldDetail" AllowSorting="True" AutoGenerateColumns="false"
OnNeedDataSource="gridGoldDetail_NeedDataSource" OnItemCommand="gridGoldDetail_ItemCommand"
AllowPaging="true" PageSize="50"
GridLines="None" ShowStatusBar="true" AllowFilteringByColumn="true" EnableHeaderContextMenu="false"
EnableHeaderContextFilterMenu="false" EnableViewState="false" GroupingEnabled="false"
ItemStyle-HorizontalAlign="Left" FeatureGroupID="Company By Book" EnableLinqExpression="false"
Visible="true" ToolTip="Company By Book">
<GroupingSettings CaseSensitive="false" />
<MasterTableView Visible="true" TableLayout="Fixed" IsFilterItemExpanded="true" CommandItemDisplay="None">
<CommandItemSettings ShowExportToWordButton="false" ShowExportToExcelButton="false"
ShowRefreshButton="false" ShowExportToCsvButton="false" ShowExportToPdfButton="false"
ShowAddNewRecordButton="false"></CommandItemSettings>
<Columns></Columns>
</MasterTableView>
<ClientSettings AllowColumnHide="false" ReorderColumnsOnClient="false" ColumnsReorderMethod="Reorder"
AllowColumnsReorder="false">
<Scrolling FrozenColumnsCount="2" AllowScroll="true" UseStaticHeaders="true" />
<Resizing AllowColumnResize="false" AllowRowResize="false" />
</ClientSettings>
<PagerStyle AlwaysVisible="true" PageSizeControlType="None" />
</twControl:TwRadGridDrc>
</telerik:RadPageView>
</telerik:RadMultiPage>
</ContentTemplate>
</telerik:RadPanelItem>
</Items>
</telerik:RadPanelBar>
<asp:Literal ID="litBook" runat="server" Visible="false" />
<asp:Literal ID="litCompany" runat="server" Visible="false" />
</telerik:RadAjaxPanel>