Column template

Live demo 1
Live demo 2

Node name : column-template

This node can be used to override the default content for cells in the column associated with the UI view property.

Warning

We strongly advise against using the column template to edit data. Firstly, for performance reasons, as the column template is built for each cell in the column. Secondly, for ergonomic reasons. Keyboard input and column navigation will not work properly.

Attributes

Attribute	Type	Required	Default value	Description
property-name	string	true		UI view property name

To access the value relative to the datagrid cell, you can use the @Value binding.

To access the item relative to the datagrid cell, you can use the @Item binding.

Example

Value binding

<datagrid>
  <column-template property-name="SomePropertyName">
    <text>@Item.SomePropertyName (@Item.SomeComplementaryPropertyName)</text>
  </column-template>
</datagrid>

In this example, the column associated to the SomePropertyName property will be rendered with a text containing the value of the property and the value of the SomeComplementaryPropertyName in parentheses.

UI view method

<datagrid>
  <column-template property-name="SomePropertyName">
    <button type="method" method-name="SomeMethod" />
  </column-template>
</datagrid>

In this example, the column associated to the SomePropertyName property will be rendered with a button calling the SomeMethod UI view method.

Note

When clicking on the button, the SomeMethod method will be called with @Item as its first parameter value.