Bind to array

This data table is bound to an array of objects defined in the component. It demonstrates basic data binding and column configuration.
Use formatBy to format rows. The value of formatBy can be a string representing a property path (e.g., "nested.value") or a function that takes the row data as input and returns the formatted value. The formatted value will be displayed in the corresponding table cell.

The table supports various formatters for different data types. See: Localization/formatters

    # Name Boolean1 Boolean2 Sexuality (Enum) Nested Value Date1 Date1
    1 Item 1 Nested Value 1 ۱۴۰۵/۲/۱۷ ۱۴۰۵/۲/۱۷
    2 Item 2 Nested Value 2 ۱۴۰۵/۲/۱۷ ۱۴۰۵/۲/۱۷
    3 Item 3 Nested Value 3 ۱۴۰۵/۲/۱۷ ۱۴۰۵/۲/۱۷

    Bind to remote data

    This data table is bound to a remote data source. It demonstrates how to use the table with server-side data, including pagination, sorting, and filtering.

    Id name nested.value
    1 Item 1 Nested Value 1
    2 Item 2 Nested Value 2
    3 Item 3 Nested Value 3

    Sort

    This data table demonstrates sorting functionality. Click on the column headers to sort the data in ascending or descending order.

    Id name description
    1 Item 1 Description 1 View
    2 Item 2 Description 2 View
    3 Item 3 Description 3 View

    Filters

    Id name description
    1 Item 1 Description 1
    2 Item 2 Description 2
    3 Item 3 Description 3

    On this page: