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
Sorry for this being piecemeal, but as I learn more, it will avoid anyone chasing down the wrong issues. I discovered that the ability to resize the columns as the user was not as non-functional as I thought. The grid comes up displaying the columns all minimum width for the data (despite even setting wider widths on some of the UltraGridColumn definitions.) I cannot seem to resize NAY columns as long as that is the case. But, if I tried enough times, I seem to be able to drag the overall grid width (right end) to the right, making it bigger. When i do so, all the columns seem to resize slightly. After I have done that, I then CAN effect grid size changes by dragging row widths around, but still it doesn;t obey what i do as the user. I drag a column width to the right to make it bigger, and instead the whole grid changes size by the amount I dragged that column edge, and then the columns are all resize fractionally to total the new grid size.
So, summarizing it a different way, as currently set:
1) All columns are coming up minimum width of the data in the rows and none can be resized.
2) After successfully dragging the right edge of the grid to the right (takes several attempts), the columns all resize by a small amount to fit the new overall grid width.
3) After the above, attmpted changes to a column width affects grid width but in such a way that all columns get resized to fill the new overall grid width.
Hopefully it is just some setting I have that is autoresizing all columns instead of obeying the new size of the single column.
Ok, I finally figured it out, and hopefully this will be helpful to someone else.
Behavior desired: Default the columns all to specific individual widths to fit wihout horizontal scrollbar while still allowing the user to resize columns individually.
Here are th things that must be set to do this (or at least this works for me now.):
1) DisplayLayout.ColWidthDefault="0px" (Actually, this can be whatever you want the width to be for any column for which you do not specify a width in #4 below).
2) DisplayLayout.AllowColSizingDefault="Free" (so user can manipulate widths)
3) DisplayLayout.TableLayout="Fixed" (also so user can manipulate column widths and not have the columns all resize when you want just one to change)
4) In each UltraGridColumn, set Width="123px" ('123' being whatever you want the column width for that column to be when first displayed.)
After I got the reply saying to do #1, my real problem was most related to #2. Once I got that right, then it obeyed my column widths in UltraGridColumn, though that did require that ALL UltraGridColumns have a Width set, because the default width of 0px causes columns without a width specified to be 0px wide. By using something other than 0px in #1 above, of course, then you can have a minimum width for those columns that you don't want to specify it on.