Templates
The Kendo UI Grid wrapper for Vue allows you to use templates for flexible customization of row and toolbar layout and appearance.
To use the custom templates which the native Vue Grid by Kendo UI supports, refer to the native Vue Grid by Kendo UI documentation.
Toolbar Template
You can define a template for the content of the toolbar of the Grid which can vary based on specific requirements.
The following example demonstrates how to implement a toolbar template which incorporates a DropDownList for the records that are sorted by category. The drop-down list is populated with the list of categories and the filter is applied on its change event by invoking the grid.dataSource.filter(params) method from the API.
Row Template
The following example demonstrates how to specify custom layout for the rows of the Kendo UI Data Grid wrapper for Vue by using property bindings from its underlying data source. The row templates are defined through script tags with ids which are associated with the rendered table HTML row elements. The example instantiates the row and altrow templates by calling the kendo.template method and assigning the returned value to the rowTemplate and altRowTemplate properties of the Grid instance.
Master-Detail Template
The Kendo UI Grid wrapper for Vue provides options for visualizing the relations between its parent and child records by displaying the table data in a hierarchical order.
