Skip to content

4.8 Datatable

Table component, used to organize and present sets of tabular data in a structured and visually effective manner.

This component is associated with a repository defined in "repo," allowing direct data linkage.

Furthermore, it features functionalities such as the ability to filter and order data based on predefined criteria, improving efficiency in searching and visualizing information.

Customization of the number of visible rows and the selection of entity properties contribute to adapting the datatable to various presentation and content needs.

Attribute Default Value Type Description
Common id null String Unique identifier of the component. If it doesn't have an id, it is assigned with the nomenclature ${tag}${num}.
render true Boolean or JEXLExpression EL expression to evaluate if the component should be displayed.
onBeforeRender null String JS method to execute before the current component is rendered.
onAfterRender null String JS method that will be executed once the current component is rendered.
action null String Identifier of the action to perform when the user interacts with this component.
allowsPartialRestore false Boolean If the state of the current component should be restored when the user returns to the view.
repo null String Identifier of the repository used to fetch the data.
numVisibleRows null Integer Number of visible rows. If there are more records, the vertical scrollbar will be displayed.
properties null String Comma-separated list of entity properties to define the set of form fields.

Image 1

4.8.1 Column

Attribute Default Value Type Description
Common id null String Unique identifier of the component. If it doesn't have an id, it is assigned with the nomenclature ${tag}${num}.
render true Boolean or JEXLExpression EL expression to evaluate if the component should be displayed.
onBeforeRender null String JS method to execute before the current component is rendered.
onAfterRender null String JS method that will be executed once the current component is rendered.
action null String Identifier of the action to perform when the user interacts with this component.
allowsPartialRestore false Boolean If the state of the current component should be restored when the user returns to the view.
value null String or JEXLExpression EL expression to calculate the value of the component.
headerText null String Label for the column header.
filtering Boolean If true, the datatable data can be filtered by the value provided in this column.
ordering Boolean If true, the datatable data can be ordered in descending or ascending order by this column.

4.8.1.1 Filter

Attribute Default Value Type Description
property null String Entity field by which to filter.
matching String Relationship type: "eq | le | gt | contains".
valueExpression String or JEXLExpression Value with which the filtering will be performed.

4.8.1.2 Order

Attribute Default Value Type Description
property String Entity field by which to order.

4.8.2 Repofilter

Attribute Default Value Type Description
id null String Unique identifier of the component. If it doesn't have an id, it is assigned with the nomenclature ${tag}${num}.

The repoFilter tag has no attributes; the expression is defined by nesting predicate tags such as and, or.

  • Operators: EQ, LT, GT, LE, GE, IN, NOT_IN, IS_NULL, NOT_NULL, LIKE, CONTAINS, STARTS_WITH, ENDS_WITH.
  • Criteria: and, or
Attribute Default Value Type Description
property null String Name of the entity property used to filter the results.
mandatory false Boolean An operator can include the parameter "mandatory=True" to indicate that the query cannot be executed if that value is not available.
value null String or JEXLExpression EL expression used as the value. 
<datatable id="datatableProvincia2" repo="provinciaRepo" numVisibleRows="5">
    <column id="column_c_provincia_id" headerText="Cod. Provincia" filtering="true" ordering="true" value="${entity.c_provincia_id}">
        <filter property="c_provincia_id" matching="contains" valueExpression="${this.column_c_provincia_id}"/>
        <order property="c_provincia_id"/>
    </column>
    <column id="column_d_provincia" headerText="Provincia" filtering="true" ordering="true" value="${entity.d_provincia}">
        <filter property="d_provincia" matching="contains" valueExpression="${this.column_d_provincia}"/>
        <order property="d_provincia"/>
    </column>
</datatable>

 <datatable id="datatableProvincia3" repo="provinciaRepo" numVisibleRows="5">
    <column headerText="Cod. Provincia" filtering="false" ordering="false" value="${entity.c_provincia_id}"/>
    <column headerText="Provincia" filtering="false" ordering="false" value="${entity.d_provincia}"/>
    <repofilter>
        <le property="c_provincia_id" value="9"/>
    </repofilter>
</datatable>

Image 2 Image 3