(r16) ColumnAttribute < WebXEO

WebXEO Web>XeoPrimerXeoXwc>GridPanel>ColumnAttribute (revision 16) (raw view)~~EditAttach~~
-- Main.PedroRio - 16 May 2010
---+ [[WebXEO.ColumnAttribute][(xxw)ColumnAttribute]] Component

The [[WebXEO.ColumnAttribute][(xvw)ColumnAttribute]] component is used as child of a WebXEO.GridPanel (or [[WebXEO.XeoBridge][Bridge]]) component in order to select which columns should appear. By default WebXEO.GridPanel instances will show a selection of the attributes of the objects used in the data source. With the ColumnAttribute component the exact number (and which) of attributes can be selected. A SQL query can be also be executed per column to display a particular value. <br />ColumnAttribute text:<br /> <img width="379" alt="columnAttribute.PNG" src="%ATTACHURLPATH%/columnAttribute.PNG" height="46" />

*XML Definition:*
<verbatim><xvw:columnAttribute 
   dataField='name' 
   ....

   label='Nome'
 ></verbatim> <pre><verbatim></xvw:columnAttribute></verbatim>
</pre>

---+++++ Properties

List of Properties of the ColumnAttribute component:
| *Property* | *Description* | *Type* | *Possible Values* | *Usage* | *Default Value* | *Example* |
| dataField | Name of the column of the DataListConnector / boObjectList, can also be used as alias to SQL columns | String | The name of an SQL from the sqlExpression property or the name of a file from the DataListConnector | Required | | |
| label | The label to show in the table header column | String / EL | | Optional | | |
| width | The width of this column (in pixels) | Int | Any positive integer | Optional* | | <p>width='100'</p> <p>* If you intend to use the export to PDF / Excel feature you need to set a valid (&gt; 0) with for each column</p> <p> *See the GridPanel page for property forceColumnFitWidth and autoExpand on restrictions regarding column width* </p> <p> </p> |
| hidden | If the column is hidden or not by default | Boolean | True / False | Optional | False | |
| resizable | If the column size (width) can be changed by the user | Boolean | True / False | Optional | True | |
| sortable | If the rows can be sorted by this column | Boolean | True / False | Optional | True | |
| groupable | If the results can be grouped by this column | Boolean | True / False | Optional | True | |
| searchable | If the results of the grid panel can be searched by this column | Boolean | True / False | Optional | True | |
| hideable | If this column can be hidden (by the user) | Boolean | True / False | Optional | True | |
| contentHtml | Marks the content of the column as HTML, this is used when exporting the column values to another format (excel, pdf) and it marks that the content is HTML (or not) and will be converted to final format knowing this. | Boolean | True / False | Optional | False | |
| lookupViewer | Force the lookup viewer name when searching by this column. | String | The name of a Lookupviewer | Optional | | |
| [[#renderer][renderer]] | An implementation of the netgest.bo.xwc.components.classic.GridColumnRenderer interface which allows the column attribute to rendered in a custom way | EL -&gt;GridColumnRenderer | | Optional | | <p>Must be binded to a bean renderer = '#{viewBean.myRenderer}'</p> <p> *CANNOT BE THE BOUI Column (or any other column that serves as the row identifier)* </p> |
| renderTemplate | Render template, or <a target="_blank" href="http://www.json.org/">JSON </a>object with several render templates according to the value for this column. | String | | Optional | | |
| [[#sqlExpression][sqlExpression]] | Sql query to execute to retrieve the values of this column | String | | Optional | | |
| wrapText | Whether or not to wrap the text of column (usefull for columns of type LongText) | Boolean | True / False | Optional | False | |
| frozen | Frozens a column (meaning it stays in the same place even when horizontal scrolling) - *See notes* | Boolean | True / False | Optional | False | Only avaialable on the XEOJQUERY Grid implementation, not available on the default ExtJS Grid |

*Notes:*

Columns that use SQL expressions can only be textual columns at the moment, Long, Date, etc... values are not yet implemented.
---+++++ XML Definition in a Viewer

<verbatim><xvw:gridPanel enableGroupBy='true' dataSource='#{viewBean.dataList}'>
    <xvw:columns>
        <xvw:columnAttribute width='100' dataField='BOUI'/></verbatim>

---+++++ *Property - Renderer:<a name="renderer"></a>*

The renderer property allows the developer to custom render a given column attribute. *If one would want to display the value of the column in italic the following should be done.* <br /> <img width="382" alt="columnAttributeItalico.PNG" src="%ATTACHURLPATH%/columnAttributeItalico.PNG" height="79" />

*XML Definition*
<verbatim><xvw:columnAttribute dataField='myFields' renderer='#{viewBean.myRenderer}'/></verbatim>

*Java Bean Code*
<verbatim>

public GridColumnRenderer getMyRenderer() {    


             return new GridColumnRenderer() {


                 public String render( GridPanel grid, DataRecordConnector record, DataFieldConnector field ) {


                     String oValue = field.getValue();


                     return "<i>" + oValue + "</i>";


                 } 


              }


}
</verbatim>

Notes: A DataRecordConnector represents the line form the current Grid and the DataFieldConnector represents the field from the current line.
---+++++ Property - SQL Expression<a name="sqlExpression"></a>

A ColumnAttribute is declared with an SQL expression in the following way:

<verbatim><xvw:columnAttribute width='150' label='Criador' 
         dataField='CRIADOR'
         renderTemplate="&lt;div style=\'color:red;font-weight:bold\'>%s&lt;/div>"
         sqlExpression="(select username from OiXEOUser where OTeste.CREATOR$=BOUI)"
      /></verbatim>

---++++++ Declaring a SQL expression and formatting the output according to its value:

<verbatim><xvw:gridPanel enableGroupBy='true' dataSource='#{viewBean.dataList}'>
   <xvw:columns>
      <xvw:columnAttribute width='150' label='Criador' 
         dataField='CRIADOR'
         renderTemplate="
            {
               'SYSUSER': '&lt;div style=\'color:red;font-weight:bold\'>%s&lt;/div>',
               '':'Null',
               'default': 'Other'
            }
         "
         sqlExpression="(select username from OiXEOUser where OTeste.CREATOR$=BOUI)"
      /></verbatim>

*Predefined Constants to use in the dataField property _(can only be used when the the DataListConnector of the WebXEO.GridPanel component is an instance of XEOObjectListConnector - meaning that the Panel must be showing)_*

<strong><br /></strong>
| *Constant* | *Description* |
| SYS_OBJECT_ICON_16 | Renders the Icon of the Object |
| <p>SYS_OBJECT_LABEL</p> | The label of the type of object (XEOModel) |
| SYS_ICON_COMPOSED_STATE | TODO |
| SYS_CARDID | The Card Id of the object |
| SYS_ROWNUM | The number of the row |
Attachments
Topic attachments
I	Attachment	Action	Size	Date	Who	Comment
PNG	columnAttribute.PNG	manage	0.8 K	2011-02-09 - 12:28	NicolauGrosskopf
PNG	columnAttributeItalico.PNG	manage	1.3 K	2011-02-09 - 13:42	NicolauGrosskopf
Topic revision: r16 - 2014-03-18 - PedroRio
No permission to view TWiki.WebTopBar
No permission to view TWiki.WebBottomBar