I have a grid that has lots of columns. When I was using GridView, I could make it easily fit on the screen without horizontal scrolling by setting CssClass for each column and setting widths (and visibility via display:none or display: table-cell) so from site to site we could adjust what columns the customer wants to see and their default width via the stylesheet.
So now I am trying to retrofit UltraWebGrid in as the means of evaluating whether or not to move to this product, and I have yet to find a way to be able to manage the widths of the columns so that they all fit wihout horizontal scrolling. I have Wrap="true" in both the header and item rows and that works, so that if I resize a column I get the necessary wrapping, but my initial column widths are coming out al one width - too wide for most columns) and I get a long horizontal scrollbar.
My DisplayLayout section is below.
<DisplayLayout AllowColSizingDefault="Free" AllowColumnMovingDefault="OnServer" AllowDeleteDefault="No"
AllowSortingDefault="OnClient" AllowUpdateDefault="No" BorderCollapseDefault="Separate"
HeaderClickActionDefault="SortMulti" Name="WLGrid" RowHeightDefault="15px"
RowSelectorsDefault="Yes" SelectTypeRowDefault="Extended" StationaryMargins="No"
ViewType="OutlookGroupBy" UseFixedHeaders="False" >
<GroupByBox>
<BoxStyle BackColor="ActiveBorder" BorderColor="Window">
</BoxStyle>
</GroupByBox>
<GroupByRowStyleDefault BackColor="Control" BorderColor="Window">
</GroupByRowStyleDefault>
<ActivationObject BorderColor="" BorderWidth="">
</ActivationObject>
<FooterStyleDefault BackColor="LightGray" BorderStyle="Solid" BorderWidth="1px">
<BorderDetails ColorLeft="White" ColorTop="White" WidthLeft="1px" WidthTop="1px" />
</FooterStyleDefault>
<RowStyleDefault CssClass="GridRow" Wrap="True" >
<BorderDetails ColorLeft="Window" ColorTop="Window" />
<Padding Left="3px" />
</RowStyleDefault>
<FilterOptionsDefault>
<FilterOperandDropDownStyle BackColor="White" BorderColor="Silver" BorderStyle="Solid"
BorderWidth="1px" CustomRules="overflow:auto;" Font-Names="Verdana,Arial,Helvetica,sans-serif"
Font-Size="11px">
<Padding Left="2px" />
</FilterOperandDropDownStyle>
<FilterHighlightRowStyle BackColor="#151C55" ForeColor="White">
</FilterHighlightRowStyle>
<FilterDropDownStyle BackColor="White" BorderColor="Silver" BorderStyle="Solid" BorderWidth="1px"
CustomRules="overflow:auto;" Font-Names="Verdana,Arial,Helvetica,sans-serif"
Font-Size="11px" Height="300px" Width="200px">
</FilterDropDownStyle>
</FilterOptionsDefault>
<HeaderStyleDefault CssClass="GridHeader" Wrap="True" Height="30px" />
<FrameStyle BackColor="Window" BorderColor="InactiveCaption" BorderStyle="Solid"
BorderWidth="1px" Font-Names="Microsoft Sans Serif" Font-Size="8.25pt" Height="275px"
Width="930px">
</FrameStyle>
<Pager MinimumPagesForDisplay="2" AllowPaging="True" PageSize="12" >
<PagerStyle CssClass="GridPager" >
</PagerStyle>
</Pager>
</DisplayLayout>
As you can see, I tried following another post that indicated how to get as-wide-as-it-takes type behavior, but that didn't work (unless as-wide-as-it-takes means setting all columns to the width that the widest column needs), but then as-wide-as-it-takes, even if it differs column to column, still isn;t what I want anyway, though better than what I am getting. Of course, ideally, I'd like to stil be able to use the CSS stylesheet classes to control it all, but any approach that allows me to have column widths each be set appropriately so I avoid horizontal scrolling is fine.
Down to one day to finish my eval and report back to my boss.
Thanks.
You should be able to set Grid.DisplayLayout.ColumnWidthDefault to "0px", and then set each column's width to a specific "<N>px".
This can be done either in the designer, or programmatically.
Yet more info. When I put actual Width settings in my UltraGridColumn definitions, they have no effect. Since setting ColumnWidthDefault to "0px", the columns always and only ever are the minimum width needed - with wrapping, to display the data rows in the grid. I'm thinking I still must be doing something wrong. I can't imagine that user ability to adjust column widths would be restricted to columns all starting out one width.
-Ed
Setting ColumnWidthDefault to "0px" does not allow the columns to automatically size to whatever is needed, but now the user cannot manipulate the width further. That is, I now no longer have a horizontal scrollbar when I load the page, but when the user hovers the mouse over the header, I see the little <--> icon to resize a column and can drag it, but when I let go of the mouse button no column resizing occurs. The only change I made was setting ColumnWidthDefault to "0px" in the DisplayLayout section of my ascx. I still need to go and set widths of individual columns, but I don;t see how that would impact what i am now seeing. Is it not possible to control the widths as they initially appear while allowing the user to also resize the coluymns?
Oh, and thanks for the quick reply on the first step of this, anyway. This is one of only a couple areas left that I need to reach a favorable result on to be able to complete the eval with a recommendation to go with this grid. It's one of the things GridView can't do (user column resize) so it's one of the things that without which, I can;t justify moving away from GridView.