RadGrid Column header and data item alignment problem

2 posts, 0 answers
  1. Yamin
    Yamin avatar
    3 posts
    Member since:
    Feb 2012

    Posted 11 Apr 2012 Link to this post

    Hi,  I'm facing very weird problem with the column header and item alignment.
    I need to use the UseStaticHeader ="true" and AllowcolumnResize ="true" for requirements point.
    I also need to fix the size of each column header which depend on the data.
    The problem i'm facing now is If the grid got a lot rows , the alignment issue not occur.
    once the grid row have a few data(two or three rows) the header and item alignment got problem.
    By the way ,i using version - 2012.1.215.40
    Do you have any idea what happening in my grid.
    Can i get an answer as soon as possible. I need an urgent solution :(
    Please see my attach code and screen capture.
    ========================== Exception.ascx.cs=====================================================
    protected void grdFatal_PreRender(object sender, EventArgs e)
          {
              if (grdFatal.Items.Count != 0)
              {
                  GridColumn grdCellTower = grdFatal.MasterTableView.GetColumn("CellTowerId");
                  grdCellTower.HeaderStyle.Width = Unit.Pixel(80);
     
                  GridColumn grdDate = grdFatal.MasterTableView.GetColumn("Date");
                  grdDate.HeaderStyle.Width = Unit.Pixel(80);
     
                  GridColumn grdFWVer = grdFatal.MasterTableView.GetColumn("FWVer");
                  grdFWVer.HeaderStyle.Width = Unit.Pixel(55);
     
                  GridColumn grdLastStatus = grdFatal.MasterTableView.GetColumn("LastStatus");
                  grdLastStatus.HeaderStyle.Width = Unit.Pixel(65);
     
                  GridColumn grdMeterType = grdFatal.MasterTableView.GetColumn("MeterType");
                  grdMeterType.HeaderStyle.Width = Unit.Pixel(95);
     
                  GridColumn grdModemFWVer = grdFatal.MasterTableView.GetColumn("ModemFWVer");
                  grdModemFWVer.HeaderStyle.Width = Unit.Pixel(120);
     
                  GridColumn grdSerialNumber = grdFatal.MasterTableView.GetColumn("SerialNumber");
                  grdSerialNumber.HeaderStyle.Width = Unit.Pixel(120);
     
                  GridColumn grdStatusId = grdFatal.MasterTableView.GetColumn("StatusId");
                  grdStatusId.HeaderStyle.Width = Unit.Pixel(55);
     
                  GridColumn grdStatusName = grdFatal.MasterTableView.GetColumn("StatusName");
                  grdStatusName.HeaderStyle.Width = Unit.Pixel(90);
     
                  GridColumn grdTxJobId = grdFatal.MasterTableView.GetColumn("TxJobId");
                  grdTxJobId.HeaderStyle.Width = Unit.Pixel(58);
              }
          }


    ========================== Exception.ascx=====================================================
    function ColumnResizing(sender, args) {
     
                    if (args._gridColumn._data.UniqueName == "CellTowerId" && args._gridColumn._columnResizer._currentWidth < 80)
                    { args._cancel = true; }
                    else if (args._gridColumn._data.UniqueName == "Date" && args._gridColumn._columnResizer._currentWidth < 80)
                    { args._cancel = true; }
                    else if (args._gridColumn._data.UniqueName == "FWVer" && args._gridColumn._columnResizer._currentWidth < 55)
                    { args._cancel = true; }
                    else if (args._gridColumn._data.UniqueName == "LastStatus" && args._gridColumn._columnResizer._currentWidth < 65)
                    { args._cancel = true; }
                    else if (args._gridColumn._data.UniqueName == "MeterType" && args._gridColumn._columnResizer._currentWidth < 95)
                    { args._cancel = true; }
                    else if (args._gridColumn._data.UniqueName == "ModemFWVer" && args._gridColumn._columnResizer._currentWidth < 120)
                    { args._cancel = true; }
                    else if (args._gridColumn._data.UniqueName == "SerialNumber" && args._gridColumn._columnResizer._currentWidth < 120)
                    { args._cancel = true; }
                    else if (args._gridColumn._data.UniqueName == "StatusId" && args._gridColumn._columnResizer._currentWidth < 55)
                    { args._cancel = true; }
                    else if (args._gridColumn._data.UniqueName == "StatusName" && args._gridColumn._columnResizer._currentWidth < 108)
                    { args._cancel = true; }
                    else if (args._gridColumn._data.UniqueName == "TxJobId" && args._gridColumn._columnResizer._currentWidth < 90)
                    { args._cancel = true; }
                    else if (args._gridColumn._data.UniqueName == "Error" && args._gridColumn._columnResizer._currentWidth < 600)
                    { args._cancel = true; }     
        }
    </script>
     
     
     <div id="divGrid" style="margin-left:5px;">
                    <telerik:RadGrid ID="grdFatal" AllowMultiRowSelection="True" runat="server"
                            AllowPaging="True" OnSelectedIndexChanged="grdFatal_OnSelectedIndexChanged"
                            ShowStatusBar="True" Width="99%" onprerender="grdFatal_PreRender"
                            onitemcreated="grdFatal_ItemCreated"
                            onneeddatasource="grdFatal_NeedDataSource" CellSpacing="0"
                            GridLines="Horizontal" Skin="WebBlue" AllowSorting="True" >
                      <MasterTableView PageSize="10" TableLayout="Fixed">
                        <CommandItemSettings ExportToPdfText="Export to PDF" />
                        <RowIndicatorColumn Visible="True" FilterControlAltText="Filter RowIndicator column" />
                        <ExpandCollapseColumn Visible="True" FilterControlAltText="Filter ExpandColumn column" />
                        <Columns>
                            <telerik:GridClientSelectColumn UniqueName="ClientSelectColumn" HeaderStyle-Width="30px"
                                Resizable="False" >                       
                        <HeaderStyle Width="30px"></HeaderStyle>
                            </telerik:GridClientSelectColumn>
                        </Columns>
         
                        <EditFormSettings>
                            <EditColumn FilterControlAltText="Filter EditCommandColumn column" />
                        </EditFormSettings>
                    </MasterTableView>
                        <HeaderStyle Wrap="false" HorizontalAlign="Left" VerticalAlign="Middle" />
                        <ItemStyle Wrap="true" HorizontalAlign="Left" VerticalAlign="Middle" />
                    <PagerStyle Mode="NumericPages" />           
                       
                     
                    <ClientSettings EnableRowHoverStyle="true" EnablePostBackOnRowClick="true" >
                    <Selecting CellSelectionMode="None" AllowRowSelect="True" />                
                    <Selecting AllowRowSelect="True" />
                        <Scrolling AllowScroll="true" UseStaticHeaders="true" SaveScrollPosition="true"></Scrolling>
                        <Resizing AllowColumnResize="true"  AllowRowResize="false" ResizeGridOnColumnResize="false"
                        ClipCellContentOnResize="true" EnableRealTimeResize="false" AllowResizeToFit="true"/>
                        <ClientEvents OnColumnResizing="ColumnResizing"/>
                    </ClientSettings>  
     
                <FilterMenu EnableImageSprites="False"></FilterMenu>
                </telerik:RadGrid
                    
            </div>
  2. Tsvetina
    Admin
    Tsvetina avatar
    2481 posts

    Posted 16 Apr 2012 Link to this post

    Hello Yamin,

    Try upgrading your RadControls version to the latest (2012.1.411), as a similar issue has been fixed there and let us know if this helps.

    Regards,
    Tsvetina
    the Telerik team
    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 their blog feed now.
Back to Top