Frozen columns not working correctly!

[W]

Hi All,

I'm trying to display a grid and use the frozencolumns property to freeze the first column ('Shop'). However this isn't working in IE7. Here's my code for the grid:

<telerik:RadGrid ID="RadGrid1" DataSourceID="SqlDataSource1" Skin="Vista" runat="server"
            AllowPaging="True" AllowSorting="True" GridLines="None" PageSize="50">
            <MasterTableView TableLayout="Auto" AutoGenerateColumns="false" Width="500px">
            <Columns>
                <telerik:GridHyperLinkColumn DataNavigateUrlFields="CampaignName,BranchName", DataNavigateUrlFormatString="BranchReport.aspx?CampaignName={0}&amp;BranchName={1}" DataTextField="BranchName" HeaderText="Shop" SortExpression="BranchName"></telerik:GridHyperLinkColumn>
                <telerik:GridBoundColumn DataField="GrossToday" HeaderText="Gross Today" SortExpression="GrossToday"></telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="GrossTW" HeaderText="Gross This Week" SortExpression="GrossTW"></telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="GrossTP" HeaderText="Gross This Period" SortExpression="GrossTP"></telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="GrossTY" HeaderText="Gross This Year" SortExpression="GrossTY"></telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="PaxToday" HeaderText="Pax Today" SortExpression="PaxToday"></telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="PaxTW" HeaderText="Pax This Week" SortExpression="PaxTW"></telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="PaxTP" HeaderText="Pax This Period" SortExpression="PaxTP"></telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="PaxTY" HeaderText="Pax This Year" SortExpression="PaxTY"></telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="TargetTW" HeaderText="Target This Week" SortExpression="TargetTW"></telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="TargetTP" HeaderText="Target This Period" SortExpression="TargetTP"></telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="TargetTY" HeaderText="Target This Year" SortExpression="TargetTY"></telerik:GridBoundColumn>
            </Columns>
            </MasterTableView>
            <ClientSettings AllowColumnsReorder="true" ReorderColumnsOnClient="true">
                <Resizing AllowRowResize="True" EnableRealTimeResize="True" ResizeGridOnColumnResize="True"
                    AllowColumnResize="True"></Resizing>
                <Selecting AllowRowSelect="True"></Selecting>
                <Scrolling AllowScroll="True" UseStaticHeaders="True" SaveScrollPosition="true" FrozenColumnsCount="1">
                </Scrolling>
            </ClientSettings>
            <HeaderStyle Width="120px" />
            <PagerStyle Mode="NextPrevAndNumeric" />
        </telerik:RadGrid>

Also, the Hyperlink column doesn't generate a Hyperlink, just the text in bold. Am I doing anything basic wrong?

Thanks.

[Pavel]

Hello Imran,

Judging only by your markup I cannot determine what might be preventing the frozen columns to work as expected. I have prepared a small sample implementing a similar functionality which behaves correctly under IE (6 and 7). Give it a try and let us know if you need additional assistance.

Kind regards,
Pavel
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Farhad Billimoria]

Pavel &
the Telerik team ,

Can you please send us an example of frozencolumns in a radgrid which uses 

<telerik:GridBoundColumn ??

thanks
Farhad

[Pavel]

Hi Farhad,

I am attaching a sample similar to the previous one but without autogenerated columns. I hope this helps.

Kind regards,
Pavel
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Farhad Billimoria]

ok thanks.
Now I understand that UseStaticHeaders has to be "true" for the frozen columns to freeze.

When I set that, my entire grid Header row disappears. Neither do the columns freeze.

How can I resolve that ?

thanks
Farhad

[Farhad Billimoria]

I am trying to run your example and I get the following error: Please advice.
thanks Farhad

Parser Error

Description: An error occurred during the parsing of a resource required to service this request. Please review the following specific parse error details and modify your source file appropriately.

Parser Error Message: Type 'Telerik.Web.UI.GridBoundColumn' does not have a public property named 'FilterControlWidth'.

Source Error:

Line 31: ShowFooter="True" TableLayout="Auto"> Line 32: <Columns> Line 33: <telerik:GridBoundColumn FilterControlWidth="110px" DataField="ShipName" HeaderText="ShipName" SortExpression="ShipName"Line 34: UniqueName="ShipName" HeaderStyle-Width="150px"> Line 35: </telerik:GridBoundColumn>

Source File: /FrozenColumnsExample.aspx    Line: 33

[Farhad Billimoria]

I somehow got your example working, but I get this error..and a few "sys" undefined errors after that...
your grid shows up but does not freeze the column

ASP.NET AJAX client-side framework failed to load

[Farhad Billimoria]

ASP.NET AJAX client-side framework failed to load

The above error comes even if I remove Ajax from the page.

[Pavel]

Hi Farhad,

The first error you receive is due to the FilterControlWidth property, which was added in the Q2008 SP2. You are probably using an earlier version which is causing this behavior. I am reattaching the sample including the dll. Try it and let us know if that helps.

Best wishes,
Pavel
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Farhad Billimoria]

ok thanks. I got your sample to work on my pc.

But my code still does not get it to work.
I have included my radgrid here, can you please see what is wrong ?

Now I understand that UseStaticHeaders has to be "true" for the frozen columns to freeze.

When I set that, my entire grid Header row disappears. Neither do the columns freeze.

How can I resolve that ?

thanks
Farhad

 

<telerik:RadGrid ID="gridUpload" runat="server" AutoGenerateColumns="false"
                GroupingEnabled="False" PageSize="25" Width="100%" height="400" Skin="FHFBgrid" EnableEmbeddedSkins="false"  ShowStatusBar="true"
                AllowMultiRowSelection="True" OnNeedDataSource="gridUpload_NeedDataSource" OnUpdateCommand="gridUpload_UpdateCommand"
                OnCreateColumnEditor="gridUpload_CreateColumnEditor" OnPreRender="gridUpload_PreRender" AllowAutomaticUpdates="false"
                 AllowMultiRowEdit="true" AllowSorting="false"  ShowFooter="True" AlternatingItemStyle-BackColor="#fffff8"  ActiveItemStyle-BackColor="AliceBlue" CommandItemStyle-BackColor="Aqua" OnExcelMLExportStylesCreated="gridUpload_ExcelMLExportStylesCreated"
                OnExcelMLExportRowCreated="gridUpload_ExcelMLExportRowCreated" MasterTableView-ShowHeadersWhenNoRecords="true"
                OnColumnCreated="gridUpload_ColumnCreated">
                <ClientSettings EnableRowHoverStyle="false" Selecting-AllowRowSelect="false" >
                    <Selecting AllowRowSelect="false" EnableDragToSelectRows="false"  />
                    <Scrolling AllowScroll="true" UseStaticHeaders="true" SaveScrollPosition="true" FrozenColumnsCount="2"></Scrolling>
                   
                </ClientSettings>
                <PagerStyle Mode="NumericPages" Position="TopAndBottom" Font-Bold="False" ForeColor="Blue" BackColor="LightSkyBlue"></PagerStyle>
                
                <MasterTableView TableLayout="Auto" DataKeyNames="EmplID" Width="100%" GridLines="None" AllowMultiColumnSorting="true">
                    <Columns>
                        <telerik:GridBoundColumn Readonly="True" HeaderText="ID" DataField="EmplID" UniqueName="EmplID" ItemStyle-ForeColor="Silver" ItemStyle-BackColor="#fffffa" HeaderStyle-BackColor="#ffffec"  Visible="false" />
                        <telerik:GridBoundColumn Readonly="True" HeaderText="Last Name" DataField="EmployeeLName" UniqueName="EmployeeLName" >
                            <HeaderStyle Wrap="False" />
                            <ItemStyle Wrap="False" />
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn Readonly="True" HeaderText="First Name" DataField="EmployeeFName" UniqueName="EmployeeFName" >
                            <HeaderStyle Wrap="False" />
                            <ItemStyle Wrap="False" />
                        </telerik:GridBoundColumn>

                        <telerik:GridTemplateColumn Visible="true" HeaderText="Hire Date" UniqueName="HireDate" ItemStyle-Width="5%" HeaderStyle-Wrap="false" ItemStyle-Wrap="false" ItemStyle-VerticalAlign="Middle" ItemStyle-HorizontalAlign="Left">
                            <EditItemTemplate>
                               <asp:Literal ID="litSpanHireDate" runat="server"></asp:Literal>
                            </EditItemTemplate>
                        </telerik:GridTemplateColumn>
                       
                        <telerik:GridBoundColumn Readonly="True" HeaderText="Pay<br/>Plan" DataField="PayPlan" UniqueName="PayPlan" ItemStyle-Font-Bold="true" ItemStyle-BackColor="#fef0c7">
                            <HeaderStyle Wrap="False"  HorizontalAlign="Left" />
                            <ItemStyle Wrap="False" />
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn Readonly="True" HeaderText="Location" DataField="Location" UniqueName="Location">
                            <HeaderStyle Wrap="False"  HorizontalAlign="Left" />
                            <ItemStyle Wrap="False" />
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn Readonly="True" HeaderText="RatingID" DataField="RatingID" UniqueName="RatingID" Visible="false">
                            <HeaderStyle Wrap="False"  HorizontalAlign="Left" />
                            <ItemStyle Wrap="False"  Width="3" />
                        </telerik:GridBoundColumn>
                        <telerik:GridTemplateColumn UniqueName="TemplateColumn" HeaderText="Rating">
                            <ItemTemplate>
                               <asp:Label id="Label1" runat="server">
                                  <%#DataBinder.Eval(Container.DataItem, "Rating")%>
                               </asp:Label>
                            </ItemTemplate>
                            <EditItemTemplate>
                               <asp:DropDownList id="List1" runat="server" DataTextField="RatingID" />
                            </EditItemTemplate>
                         </telerik:GridTemplateColumn>
                        <telerik:GridBoundColumn Readonly="True" HeaderText="Grade<br/>Prior<br/>Sept 30" DataField="GradePrior930" UniqueName="GradePrior930" MaxLength="2">
                            <HeaderStyle Wrap="False"  HorizontalAlign="Left" />
                            <ItemStyle Wrap="False" />
                        </telerik:GridBoundColumn>
                       
                        <telerik:GridTemplateColumn Visible="true" HeaderText="Base Salary <br/>Prior Sept 30" UniqueName="BaseSalaryPrior930" ItemStyle-Width="5%" HeaderStyle-Wrap="false" ItemStyle-Wrap="false" ItemStyle-VerticalAlign="Middle" ItemStyle-HorizontalAlign="Left">
                            <EditItemTemplate>
                               <asp:Literal ID="litSpanBSalPri930" runat="server"></asp:Literal>
                            </EditItemTemplate>
                        </telerik:GridTemplateColumn>
                       
                        <telerik:GridBoundColumn Readonly="True" HeaderText="Grade<br/>Post<br/>Sept 30" DataField="GradePost930" UniqueName="GradePost930" MaxLength="2">
                            <HeaderStyle Wrap="False"  HorizontalAlign="Left" />
                            <ItemStyle Wrap="False" />
                        </telerik:GridBoundColumn>
                       
                        <telerik:GridTemplateColumn Visible="true" HeaderText="Base Salary <br/>Post Sept 30" UniqueName="BaseSalaryPost930" ItemStyle-Width="5px" HeaderStyle-Wrap="false" ItemStyle-Wrap="false" ItemStyle-VerticalAlign="Middle" ItemStyle-HorizontalAlign="Left">
                            <EditItemTemplate>
                               <asp:Literal ID="litSpanBSalPost930" runat="server"></asp:Literal>
                            </EditItemTemplate>
                        </telerik:GridTemplateColumn>
                       
                        <telerik:GridBoundColumn Readonly="true" HeaderText="Merit<br/>Increase<br/>%" DataField="MeritIncreasePcent" UniqueName="MeritIncreasePcent" Visible="true" ItemStyle-Font-Bold="true" ItemStyle-BackColor="LightCyan">
                            <HeaderStyle Wrap="False"  HorizontalAlign="Center" />
                            <ItemStyle Wrap="False"  Width="3" />
                        </telerik:GridBoundColumn>
                        <telerik:GridTemplateColumn Visible="false" HeaderText="Merit<br/>Increase<br/>%" UniqueName="MeritIncreasePcentOD" ItemStyle-Width="5%" HeaderStyle-Wrap="false" ItemStyle-Wrap="false" ItemStyle-VerticalAlign="Middle" ItemStyle-HorizontalAlign="Center">
                            <ItemTemplate>
                               <asp:Label id="lblMtIncPcent" runat="server">
                                  <%#DataBinder.Eval(Container.DataItem, "MeritIncreasePcent")%>
                               </asp:Label>
                            </ItemTemplate>
                            <EditItemTemplate>
                               <asp:Literal ID="litTextbox" runat="server"></asp:Literal>
                            </EditItemTemplate>
                        </telerik:GridTemplateColumn>
                       
                        <telerik:GridTemplateColumn Visible="true" HeaderText="Merit<br/>Increase<br/>Amount $" UniqueName="MeritIncreaseAmt" ItemStyle-Width="5%" HeaderStyle-Wrap="false" ItemStyle-Wrap="false" ItemStyle-VerticalAlign="Middle" ItemStyle-HorizontalAlign="Left">
                            <EditItemTemplate>
                               <asp:Literal ID="litSpanMtIncAmt" runat="server"></asp:Literal>
                            </EditItemTemplate>
                        </telerik:GridTemplateColumn>
                       
                        <telerik:GridTemplateColumn Visible="true" HeaderText="Total<br/>Base Pay<br/>$" UniqueName="TotalBasePay" ItemStyle-Width="5%" HeaderStyle-Wrap="false" ItemStyle-Wrap="false" ItemStyle-VerticalAlign="Middle" ItemStyle-HorizontalAlign="Left">
                            <EditItemTemplate>
                               <asp:Literal ID="litSpanTotBPay" runat="server"></asp:Literal>
                            </EditItemTemplate>
                        </telerik:GridTemplateColumn>
                       
                        <telerik:GridTemplateColumn Visible="true" HeaderText="Maximum<br/>Base Salary<br/>Range $" UniqueName="MaxBaseSalary" ItemStyle-Width="5%" HeaderStyle-Wrap="false" ItemStyle-Wrap="false" ItemStyle-VerticalAlign="Middle" ItemStyle-HorizontalAlign="Left" ItemStyle-ForeColor="Gray"  ItemStyle-Font-Bold="true" ItemStyle-BackColor="Linen">
                            <EditItemTemplate>
                               <asp:Literal ID="litSpanMaxBSal" runat="server"></asp:Literal>
                            </EditItemTemplate>
                        </telerik:GridTemplateColumn>
                       
                        <telerik:GridTemplateColumn Visible="true" HeaderText="Final<br/>Base Salary<br/>$" UniqueName="FinalBaseSalary" ItemStyle-Width="5%" HeaderStyle-Wrap="false" ItemStyle-Wrap="false" ItemStyle-VerticalAlign="Middle" ItemStyle-HorizontalAlign="Left" ItemStyle-Font-Bold="true" ItemStyle-BackColor="Silver">
                            <EditItemTemplate>
                               <asp:Literal ID="litSpanFinalBSal" runat="server"></asp:Literal>
                            </EditItemTemplate>
                        </telerik:GridTemplateColumn>
                       
                        <telerik:GridTemplateColumn Visible="true" HeaderText="Lumpsum<br/>Payment<br/>$" UniqueName="LumpSumPayment" ItemStyle-Width="5%" HeaderStyle-Wrap="false" ItemStyle-Wrap="false" ItemStyle-VerticalAlign="Middle" ItemStyle-HorizontalAlign="Left">
                            <EditItemTemplate>
                               <asp:Literal ID="litSpanLSumPay" runat="server"></asp:Literal>
                            </EditItemTemplate>
                        </telerik:GridTemplateColumn>
                       
                        <telerik:GridTemplateColumn Visible="true" HeaderText="Comparability<br/>Rate<br/>%" UniqueName="ComparabilityRate" ItemStyle-Width="5%" HeaderStyle-Wrap="false" ItemStyle-Wrap="false" ItemStyle-VerticalAlign="Middle" ItemStyle-HorizontalAlign="Left">
                            <EditItemTemplate>
                               <asp:Literal ID="litSpanCompRate" runat="server"></asp:Literal>
                            </EditItemTemplate>
                        </telerik:GridTemplateColumn>
                       
                        <telerik:GridTemplateColumn Visible="true" HeaderText="Final<br/>Salary<br/>$" UniqueName="FinalSalary" ItemStyle-Width="5%" HeaderStyle-Wrap="false" ItemStyle-Wrap="false" ItemStyle-VerticalAlign="Middle" ItemStyle-HorizontalAlign="Left" ItemStyle-Font-Bold="true" ItemStyle-BackColor="LightGreen">
                            <EditItemTemplate>
                               <asp:Literal ID="litSpanFinalSal" runat="server"></asp:Literal>
                            </EditItemTemplate>
                        </telerik:GridTemplateColumn>
                       
                        <telerik:GridBoundColumn Readonly="True" HeaderText="Department" DataField="Department" UniqueName="Department">
                            <HeaderStyle Wrap="False"  HorizontalAlign="Center" />
                            <ItemStyle Wrap="False" />
                        </telerik:GridBoundColumn>
                        <telerik:GridTemplateColumn Visible="false" UniqueName="TemplateColumnDepartment" HeaderText="Department">
                            <ItemTemplate>
                               <asp:Label id="Label2" runat="server">
                                  <%#DataBinder.Eval(Container.DataItem, "Department")%>
                               </asp:Label>
                            </ItemTemplate>
                            <EditItemTemplate>
                               <asp:DropDownList id="List2" runat="server" DataTextField="Department" />
                            </EditItemTemplate>
                         </telerik:GridTemplateColumn>
                        <telerik:GridCheckBoxColumn Readonly="True" Visible="true" UniqueName="IsEligible" HeaderText="Is Eligible" DataField="IsEligible" DataType="System.Boolean">   
                        </telerik:GridCheckBoxColumn>
                        <telerik:GridCheckBoxColumn Readonly="False" Visible="False" UniqueName="IsEligibleDH" ColumnEditorID="IsEligibleDH" HeaderText="Is Eligible" DataField="IsEligible" DataType="System.Boolean">   
                        </telerik:GridCheckBoxColumn>
                        <telerik:GridBoundColumn Readonly="True" Visible="true" HeaderText="EligibilityComments" DataField="EligibilityComments" UniqueName="EligibilityComments">
                            <HeaderStyle Wrap="False"  HorizontalAlign="Center" />
                            <ItemStyle Wrap="False" />
                        </telerik:GridBoundColumn>
                        <telerik:GridBoundColumn Readonly="False" Visible="False" HeaderText="EligibilityComments" DataField="EligibilityComments" UniqueName="EligibilityCommentsDH">
                            <HeaderStyle Wrap="False"  HorizontalAlign="Center" />
                            <ItemStyle Wrap="False" />
                        </telerik:GridBoundColumn>
                       
                    </Columns>
               
                    <RowIndicatorColumn Visible="true">
                        <HeaderStyle Width="20px" />
                    </RowIndicatorColumn>
                    <ExpandCollapseColumn Resizable="False" Visible="False">
                        <HeaderStyle Width="20px" />
                    </ExpandCollapseColumn>

                </MasterTableView>
               
            </telerik:RadGrid>

 

[Pavel]

Hello Farhad,

From your markup I cannot see anything that might cause such behavior. If you are unable to resolve this problem, consider preparing a small runnable sample based on your application, which reproduces the behavior and attaching it to a support ticket. Thus we will be able to examine it locally and advise you accordingly.

All the best,
Pavel
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.