I have a WebGrid that is hooked up to a datasource, which works fine. However, one of the columns (named QUERY) has text that is extremely long and consequently makes the column too wide (because the column displays the entire text). Code is:
<h:panelGroup> <%-- =================================== INFRAGISTICS-CODE ==================================== --%> <ig:gridView dataSource="#{pc_Bean.reports}" pageSize="11" sortingMode="multi" resizableColumns="true" allowFixedColumns="false" binding="#{pc_Bean.grid}"> <f:facet name="header"> <h:outputText value="My Grid Title" /> </f:facet> <ig:column sortBy="id" resizable="true"> <f:facet name="header"> <h:outputText value="ID" /> </f:facet> <h:outputText value="#{DATA_ROW.id}" /> </ig:column> <ig:column sortBy="query" resizable="false" style="width: 100px"> <f:facet name="header"> <h:outputText value="Query" /> </f:facet> <h:outputText value="#{DATA_ROW.query}" style="width:100px;"/> </ig:column> <ig:column sortBy="dbSourceId" resizable="true"> <f:facet name="header"> <h:outputText value="DB Source ID" /> </f:facet> <h:outputText value="#{DATA_ROW.dbSourceId}" /> </ig:column> </ig:gridView> </h:panelGroup> <%-- =================================== INFRAGISTICS-CODE ==================================== --%>
As you can see I tried adding 100 pixel width to both <ig:column> and to the <h:outputText>, which had no effect. In addition, I changed igf_grid.css (in the default blue theme) to limit the gridcolumn to 100 pixels:
.igGridColumn { border-bottom: 1px solid #DCDCDC; padding: 5px 10px 5px 10px; white-space: nowrap; width:100px;}
This didn't have any effect either. I could probably truncate the data source field, but there's got to be an easier way to style this column to a fixed width. Please let me know of any suggestions.
Thanks
Nick
In the attached txt file
Hi ,
You can set the style of the column dynamically by using setStyle
Below is the code snippet :
HtmlColumn firstNameColumn = new HtmlColumn ();firstNameColumn.setSortBy("firstName");UnifiedOutput columnFirstNameHeader = new UnifiedOutput();columnFirstNameHeader.setValue("FirstName");firstNameColumn.setHeader(columnFirstNameHeader);UnifiedOutput columnText = new UnifiedOutput();UnifiedValueExpression uniValueExpressionFirstName = UnificationHelper.createUnifiedValueBLOCKED EXPRESSION;
How would I do this when creating dynamic columns?
Hi Bozhidar,
We have same problem in Infragistics Version 9.1 (ASP.Net) datagrid on IE7 and above only. Can you please help us for the same ? Please let us know how to specify "style" property for column in the datagrid if colums are binding dynamically from the datasource.
Vijay
Thanks Bozhidar. That worked for me.
The only limitation I noticed is that if make the column resizable, then if I resize the column greater than 100 pixels, the text truncates at 100 px. However, if I enable gridEditing, clicking on a cell shows the entire contents. And this is not a big deal at this point.