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

Grid Auto Size Coloumns

3 Answers 262 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Stuart
Top achievements
Rank 1
Stuart asked on 22 Aug 2011, 11:31 AM
Hi All

I have a grid that is using static headers with columns declaring widths using the header.width property. However I have no control over the grid size by resizing my columns,  as resizing one column stretches out the other so the grid fits the whole page, like it is auto resizing to fit the page. Any Ideas on how to have control of grid widths greatly appreciated.

<telerik:RadGrid ID="gvDefleetCapIds" runat="server" AllowSorting="True" 
                  AutoGenerateColumns="False" CellSpacing="0" Font-Names="Verdana" 
                  Font-Size="X-Small" GridLines="None" 
                  ondetailtabledatabind="gvDefleetCapIds_DetailTableDataBind" 
                  oneditcommand="gvDefleetCapIds_EditCommand" 
                  onitemcommand="gvDefleetCapIds_ItemCommand" 
                    
                  onupdatecommand="gvDefleetCapIds_UpdateCommand" Width="1246px" 
                  AllowPaging="True" PageSize="30" AllowCustomPaging="True" Skin="WebBlue" 
                  onneeddatasource="gvDefleetCapIds_NeedDataSource" 
                  onitemdatabound="gvDefleetCapIds_ItemDataBound">
                  <headercontextmenu cssclass="GridContextMenu GridContextMenu_Default" >
                  </headercontextmenu>
                  <mastertableview autogeneratecolumns="False" cellspacing="0" 
                      datakeynames="CapID,Year,Plate" font-names="Verdana" font-size="X-Small">
                                              <CommandItemSettings ExportToPdfText="Export to PDF" />
                      <RowIndicatorColumn FilterControlAltText="Filter RowIndicator column">
                      </RowIndicatorColumn>
                      <ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column" 
                          Visible="True">
                      </ExpandCollapseColumn>
                      <Columns>
                        
                          <telerik:GridBoundColumn DataField="CapID" HeaderStyle-Width="25px"
                              FilterControlAltText="Filter column2 column" HeaderText="CapID" 
                              UniqueName="column2">
                          </telerik:GridBoundColumn>
                            
                          <telerik:GridBoundColumn DataField="V_Description"
                              FilterControlAltText="Filter column1 column" HeaderText="V_Description" 
                              UniqueName="column1">
                          </telerik:GridBoundColumn>
                            
                          <telerik:GridBoundColumn DataField="Plate" HeaderStyle-Width="10px"
                              FilterControlAltText="Filter column column" HeaderText="Plate" 
                              UniqueName="column">
                          </telerik:GridBoundColumn>
                            
                           <telerik:GridBoundColumn DataField="Year" 
                              FilterControlAltText="Filter column4 column" HeaderText="Year" HeaderStyle-Width="20px"
                              UniqueName="column4">
                          </telerik:GridBoundColumn>
                            
                          <telerik:GridBoundColumn DataField="Units" HeaderStyle-Width="10px"
                              FilterControlAltText="Filter column6 column" HeaderText="Units" 
                              UniqueName="column6">
                          </telerik:GridBoundColumn>
                            
                          <telerik:GridBoundColumn DataField="Price" HeaderStyle-Width="25px"
                              FilterControlAltText="Filter column3 column" HeaderText="CAP_Price" 
                              UniqueName="column3">
                          </telerik:GridBoundColumn>                         
                           
                          <telerik:GridBoundColumn Aggregate="Sum" DataField="AvgMiles" 
                              FilterControlAltText="Filter column5 column" HeaderText="AvgMiles" HeaderStyle-Width="25px"
                              UniqueName="column5">
                          </telerik:GridBoundColumn>
                            
                          <telerik:GridButtonColumn ButtonType="ImageButton" CommandName="Delete" 
                              ConfirmDialogType="RadWindow" ConfirmText="Delete this CAPID ?" 
                              ConfirmTitle="Confirm Delete" Text="Delete" UniqueName="DeleteColumn">
                              <ItemStyle CssClass="DeleteButton" HorizontalAlign="Center" />
                          </telerik:GridButtonColumn>
                      </Columns>
                      <EditFormSettings>
                          <EditColumn FilterControlAltText="Filter EditCommandColumn column">
                          </EditColumn>
                      </EditFormSettings>
                  </mastertableview>
               <clientsettings>
                      <Scrolling AllowScroll="True" SaveScrollPosition="true"  ScrollHeight="625px" />
                  </clientsettings>
                  <filtermenu enableimagesprites="False">
                  </filtermenu>
              </telerik:RadGrid>

3 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 22 Aug 2011, 12:07 PM
Hello Stuart,

Try setting the property ResizeGridOnColumnResize to false to keep Grid size while resizing.

Also take a look at the following documentation for more resizing.
Resizing Columns.

Thanks,
Shinu.
0
Stuart
Top achievements
Rank 1
answered on 22 Aug 2011, 12:57 PM
Thanks for the response

Added

<ClientSettings>
           <Resizing ResizeGridOnColumnResize=false></Resizing>
           <Scrolling AllowScroll=true ScrollHeight=625px SaveScrollPosition=true UseStaticHeaders=true></Scrolling>       
</ClientSettings>

also changed widths to 50px and V_Description to 400px.  This still adapts the cols to the size of the full page :(

NB The grid is contained in a HTML table

<table style="width: 100%;">
       <tr>
           <td class="topBorder">

Read that page but it seem mostly to allows users to resize the grid, which is not needed.  Is this width the issue?

Thanks

0
Sebastian
Telerik team
answered on 24 Aug 2011, 10:27 AM
Hello Stuart,

To limit the size of the grid when you enable its scrolling feature or specify fixed width for its columns, set the MasterTableView -> TableLayout property of the control to Fixed. When it resides in another html table container as in your case, consider setting its table-layout attribute to fixed due to the IE boxing model as depicted in the description of this demo.
 
Best regards,
Sebastian
the Telerik team

Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

Tags
Grid
Asked by
Stuart
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
Stuart
Top achievements
Rank 1
Sebastian
Telerik team
Share this question
or