RadGrid Column width issues after upgrade to Telerik 2013.2.611 version

13 posts, 1 answers
  1. Karthik
    Karthik avatar
    18 posts
    Member since:
    Aug 2010

    Posted 18 Jun 2013 Link to this post

    Hi,

    Yesterday I upgraded the telerik version to the latest 611 release and found that the RadGrid is not working fine as it was previously doing.
    I have my RadGrid with some 10 columns and I have the ItemStyle-Width and the HeaderStyle-width set for each of the columns.
    The grid renders fine for the first time when there is a postback performed the column settings are messed up for the headings.

    I went in to check with the firebug tool and found that the colGroup settings are messed up when there is a postback.

     
    <telerik:GridTemplateColumn HeaderText="One" SortExpression="One" DataField="One"
        UniqueName="One" ItemStyle-Width="10%" HeaderStyle-Width="10%">                   
        <ItemTemplate>
            <%# DataBinder.Eval(Container.DataItem, "One").ToString%> 
        </ItemTemplate>
    </telerik:GridTemplateColumn>
    <telerik:GridTemplateColumn HeaderText="Two" SortExpression="Two"
        UniqueName="Two" DataField="Two" ItemStyle-Width="15%" HeaderStyle-Width="15%">
        <ItemTemplate>
            <%# DataBinder.Eval(Container.DataItem, "Two").ToString().Split(" ")(0)%> 
        </ItemTemplate>
    </telerik:GridTemplateColumn>         
    <telerik:GridTemplateColumn HeaderText="Three" SortExpression="Three" DataField="Three"
        UniqueName="Three" ItemStyle-Width="20%" HeaderStyle-Width="20%">                   
        <ItemTemplate>
            <%# DataBinder.Eval(Container.DataItem, "Three").ToString%> 
        </ItemTemplate>
    </telerik:GridTemplateColumn>
    <telerik:GridTemplateColumn HeaderText="Four" SortExpression="Four" DataField="Four"
        UniqueName="Four" ItemStyle-Width="20%" HeaderStyle-Width="20%">                   
        <ItemTemplate>
        <%# DataBinder.Eval(Container.DataItem, "Four").ToString.Replace(Chr(13),"</br>")%> 
        </ItemTemplate>
    </telerik:GridTemplateColumn>
    <telerik:GridTemplateColumn HeaderText="Five" SortExpression="Five"
        UniqueName="Five" DataField="Five" ItemStyle-Width="20%" HeaderStyle-Width="20%">
        <ItemTemplate>
            <%# DataBinder.Eval(Container.DataItem, "Five").ToString%> 
        </ItemTemplate>
    </telerik:GridTemplateColumn>
    <telerik:GridTemplateColumn HeaderText="Six" SortExpression="Six"
        UniqueName="Six" DataField="Six" ItemStyle-Width="8%" HeaderStyle-Width="8%">
        <ItemTemplate>
            <%# DataBinder.Eval(Container.DataItem, "Six").ToString().Split(" ")(0)%>
        </ItemTemplate>
    </telerik:GridTemplateColumn>

    Column settings for the colGroup changes during a postback. I found an extra set of col width setting inserted after postback which has the width set in pixels. Where as the width settings for the tbody contents are fine. I have attached an image showing the width settings rendered before and after postback below.

    Please do let me know how this issue can be fixed.

    Thanks,
    Karthik

  2. Ryan Dotson
    Ryan Dotson avatar
    1 posts
    Member since:
    Aug 2008

    Posted 18 Jun 2013 Link to this post

    I am experiencing this same issue.  It does not seem to be specific to any browsers (as your sample HTML would suggest)  Any resolution?
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Karthik
    Karthik avatar
    18 posts
    Member since:
    Aug 2010

    Posted 19 Jun 2013 Link to this post


    As of now I don't have a solution. The help documents which I referred advises to have one column with no width settings and also to have only the HeaderStyle-Width set for the other columns. I tried with those settings but it didn't help.
  5. Georg
    Georg avatar
    12 posts
    Member since:
    Nov 2009

    Posted 19 Jun 2013 Link to this post

    The same issue here...and it buggs me alot as with each major update something so obvious is getting messed up...

    <telerik:RadGrid ID="gridCustomers" EnableLinqExpressions="false" Width="100%"
            Height="350" OnNeedDataSource="gridCustomers_NeedDataSource" onitemcommand="gridCustomers_ItemCommand" OnInit="gridCustomers_Init" runat="server"
            AllowPaging="true" AllowCustomPaging="true" PageSize="10"
            EnableAjaxSkinRendering="true" GridLines="None" AllowSorting="true"
            style="border:none !important;">
            <PagerStyle Mode="NextPrevAndNumeric" AlwaysVisible="true"  />
            <ClientSettings EnablePostBackOnRowClick="true" EnableRowHoverStyle="true" AllowColumnsReorder="false" Resizing-AllowColumnResize="false">
                <Scrolling SaveScrollPosition="true" AllowScroll="true" UseStaticHeaders="true" />
                <Selecting AllowRowSelect="True" />
            </ClientSettings>
            <HeaderStyle Wrap="false" />
            <ItemStyle Wrap="false" Font-Size="11px" CssClass="gridCursor" />
            <AlternatingItemStyle Wrap="false" Font-Size="11px" CssClass="gridCursor" />
            <GroupingSettings CaseSensitive="false" />
            <MasterTableView DataKeyNames="CustomerID" GroupLoadMode="Server" NoMasterRecordsText="No Customers available for display..." TableLayout="Auto" AutoGenerateColumns="false" AllowFilteringByColumn="true">
                <FilterItemStyle HorizontalAlign="Left" />
                <HeaderStyle HorizontalAlign="Left" />
                <Columns>
                    <telerik:GridBoundColumn DataField="CustomerID" UniqueName="CustomerID" SortExpression="CustomerID" HeaderStyle-Width="140px" HeaderText="Customer ID" CurrentFilterFunction="Contains" FilterControlWidth="100px" ItemStyle-HorizontalAlign="Left" AutoPostBackOnFilter="true"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="AccountNumber" HeaderStyle-Width="120px" HeaderText="Account" CurrentFilterFunction="Contains" FilterControlWidth="80px" ItemStyle-HorizontalAlign="Left" AutoPostBackOnFilter="true"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="FirstName" HeaderStyle-Width="120px" HeaderText="First Name" ItemStyle-HorizontalAlign="Left" CurrentFilterFunction="Contains" FilterControlWidth="80px" AutoPostBackOnFilter="true"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="LastName" HeaderStyle-Width="120px" HeaderText="Last Name" ItemStyle-HorizontalAlign="Left" CurrentFilterFunction="Contains" FilterControlWidth="80px" AutoPostBackOnFilter="true"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="OfficePhone" HeaderStyle-Width="110px" HeaderText="Office Phone" ItemStyle-HorizontalAlign="Left" CurrentFilterFunction="Contains" FilterControlWidth="60px" AutoPostBackOnFilter="true"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="PracticeName" HeaderStyle-Width="170px" HeaderText="Practice Name" ItemStyle-HorizontalAlign="Left" HtmlEncode="true" HeaderStyle-HorizontalAlign="Left" CurrentFilterFunction="Contains" FilterControlWidth="130px" AutoPostBackOnFilter="true"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="Cell" HeaderStyle-Width="100px" HeaderText="Cell Phone" ItemStyle-HorizontalAlign="Left" CurrentFilterFunction="Contains" FilterControlWidth="60px" AutoPostBackOnFilter="true"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="Address1" HeaderStyle-Width="160px" HeaderText="Address 1" ItemStyle-HorizontalAlign="Left" CurrentFilterFunction="Contains" FilterControlWidth="120px" AutoPostBackOnFilter="true"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="City" HeaderStyle-Width="100px" HeaderText="City" ItemStyle-HorizontalAlign="Left" CurrentFilterFunction="Contains" FilterControlWidth="60px" AutoPostBackOnFilter="true"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="State" HeaderStyle-Width="70px"  HeaderText="State" ItemStyle-HorizontalAlign="Left" CurrentFilterFunction="Contains" FilterControlWidth="30px" AutoPostBackOnFilter="true"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="ZipCode" HeaderStyle-Width="90px" HeaderText="Zip Code" ItemStyle-HorizontalAlign="Left" CurrentFilterFunction="Contains" FilterControlWidth="50px" AutoPostBackOnFilter="true"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="Country" HeaderStyle-Width="90px" HeaderText="Country" ItemStyle-HorizontalAlign="Left" CurrentFilterFunction="Contains" FilterControlWidth="50px" AutoPostBackOnFilter="true"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="Email" HeaderStyle-Width="230px" HeaderText="Email" ItemStyle-HorizontalAlign="Left" CurrentFilterFunction="Contains" FilterControlWidth="190px" AutoPostBackOnFilter="true"></telerik:GridBoundColumn>
                </Columns>
            </MasterTableView>
        </telerik:RadGrid>
  6. Tommy
    Tommy avatar
    27 posts
    Member since:
    Feb 2008

    Posted 19 Jun 2013 Link to this post

    Hi,

    I have the same issue. Seems to me that it has something to do with the "UseStaticHeader" attribute. If I set it to false, the grid looks normal. But I need it to be set to true.

    I need a fix for this. Thank you.

    Thomas
  7. Karthik
    Karthik avatar
    18 posts
    Member since:
    Aug 2010

    Posted 20 Jun 2013 Link to this post

    Hi Thomas,

    I have the issue for the grids which does not have the scrolls enabled. I have the AllowScroll, UseStaticHeaders set to false. It didn't help.
    For me the grid looks fine during the initial load. But when there is a postback performed the grid column width settings are messed up.

    Karthik
  8. Answer
    Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 21 Jun 2013 Link to this post

    Hello Karthik,

    I suppose that the issue you are facing is related to the problem we have discovered in the latest official Q2 2013 release and which is described in the sticky thread below:
    http://www.telerik.com/community/forums/aspnet-ajax/grid/radgrid-layout-breaks-on-postback-in-q2-2013-release.aspx

    Review the thread and verify if removing the problematic <FilterMenu></FilterMenu> tags helps.

    Regards,
    Maria Ilieva
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  9. Cyril Iselin
    Cyril Iselin avatar
    15 posts
    Member since:
    Dec 2009

    Posted 30 Jun 2013 Link to this post

    Hello

    Only remove the Tag "<FilterMenu></FilterMenu>" don't work for me.
    But the internal build hast fixed my errors too.

    Best Greetings

    Cyril Iselin
  10. Kyle
    Kyle avatar
    23 posts
    Member since:
    Jun 2013

    Posted 03 Jul 2013 Link to this post

    We were losing our column widths on postback.

    We commented out the FilterMenu per the link and it worked for us.  

    You may also want to try removing:

    RowIndicatorColumn
    ExpandCollapseColumn
    EditFormSettings






  11. msigman
    msigman avatar
    141 posts
    Member since:
    Apr 2008

    Posted 21 Jul 2013 Link to this post

    Removing <FilterMenu></FilterMenu> fixed it for us.
  12. Dennis
    Dennis avatar
    4 posts
    Member since:
    May 2011

    Posted 24 Oct 2013 Link to this post

    Having this problem, no <FilterMenu> tags defined nor any of the other tags mentioned.  Any other ideas?
  13. Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 28 Oct 2013 Link to this post

    Hi Dennis,

    Could I kindly ask you to open a separate forum thread or a support ticket where you could share more information on the exact issue you are currently facing? Sharing what is the control's version you are using, the browsers where the issue appear and the exact setting you have on your page will be of a big help for further researching the issue and provide proper solution for your specific case.


    Regards,
    Maria Ilieva
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  14. Karthik
    Karthik avatar
    18 posts
    Member since:
    Aug 2010

    Posted 29 Oct 2013 Link to this post

    Hi All,

    Try upgrading to the latest version of Telerik Controls. Telerik has the issues fixed it with the latest versions. Use the version 2013.2.717 or above.

    Regards
    Karthikeyan S
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017