Skip to content

DataTable

The DataTable widget provides a tabular interface optimized for displaying large datasets. While it offers a limited data entry capability through row editors, its primary function is efficient data visualization. It is significantly more efficient than the TableContent widget for handling large amounts of data.

Key Features

  • High-performance data display for large datasets, outperforming TableContent.
  • Limited data entry functionality; primarily designed for data display.
  • Does not support row-level rules.
  • Table import/export functionality.

Data Model

The DataTable widget uses a sequence-type data model. Each row in the table is represented as a new element within this data model, containing the row's data.

Table Columns

Columns utilize data templates to display data in a specific format. Each column is defined with a data type, influencing how data is presented. Column headers and footers also support data templates for calculated values.

When column template is not specified, the column's data type will be used to determine the appropriate template.

Unique Row IDs

To automatically generate unique IDs for each row, specify an XPath expression via the RowIdXPath property. This expression will be evaluated for each row to create a unique identifier.

Data Exchange

DataTable supports the import and exporting of data in XLSx format. Layout of the data is specified via the Columns property. By default export is enabled and import is disabled. You may need to set the AllowImport property to True if you want to allow users to import data.

Import and exporting layout is specified via the Columns property. Each column has an Caption property that determines the column header. The XPath property determines the data source for the column. Type property that determines how the data is imported and exported. Types include:

  • Text
  • Number
  • DateTime

Row Editor

Each row in the DataTable has an editor pane accessible via a modal dialog. This allows users to edit the row's data in a separate, focused interface.

Example

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
<DataTable RequiredForGroup="save" ShowBlankSlate="True" XPath="DynamicList">
    <Rules/>
    <ItemXPath><![CDATA[*]]></ItemXPath>
    <RowIdXPath><![CDATA[]]></RowIdXPath>
    <FilterXPath><![CDATA[]]></FilterXPath>
    <SortXPath><![CDATA[]]></SortXPath>
    <ItemsRootXPath><![CDATA[]]></ItemsRootXPath>
    <AllowMovingXPath><![CDATA[]]></AllowMovingXPath>
    <AllowMoveUpDownXPath><![CDATA[]]></AllowMoveUpDownXPath>
    <AllowNewXPath><![CDATA[]]></AllowNewXPath>
    <AllowDeleteXPath><![CDATA[]]></AllowDeleteXPath>
    <AllowDeleteAllXPath><![CDATA[0]]></AllowDeleteAllXPath>
    <AddNewLabel>
        <Content><![CDATA[Add New Row]]></Content>
    </AddNewLabel>
    <RowScript>
        <Content><![CDATA[]]></Content>
    </RowScript>
    <DataExchange AllowImport="False" AllowExport="True">
        <Columns>
            <Column Caption="Text" Type="Text">
                <XPath><![CDATA[Text]]></XPath>
            </Column>
            <Column Caption="Number" Type="Number">
                <XPath><![CDATA[Number]]></XPath>
            </Column>
            <Column Caption="Date" Type="DateTime">
                <XPath><![CDATA[Date]]></XPath>
            </Column>
        </Columns>
    </DataExchange>
    <RowRules/>
    <Columns>
        <Column Align="Left" Type="Text" XPath="Text">
            <Label>
                <Content><![CDATA[Text Header]]></Content>
            </Label>
            <Template><![CDATA[]]></Template>
            <Footer>
                <Content><![CDATA[Footer]]></Content>
            </Footer>
        </Column>
        <Column Align="Left" Type="Number" XPath="Number">
            <Label>
                <Content><![CDATA[Number Header]]></Content>
            </Label>
            <Template><![CDATA[]]></Template>
            <Footer>
                <Content><![CDATA[Number Footer {{sum(*/Number)}} ]]></Content>
            </Footer>
        </Column>
        <Column Align="Left" Type="Date" XPath="Date">
            <Label>
                <Content><![CDATA[Date Header]]></Content>
            </Label>
            <Template><![CDATA[]]></Template>
            <Footer>
                <Content><![CDATA[Date Footer]]></Content>
            </Footer>
        </Column>
    </Columns>
    <Editor>
        <RowContent Type="Field" Collapsing="None" FitHeight="False">
            <Rules/>
            <Label>
                <Content><![CDATA[Text]]></Content>
            </Label>
            <Columns>
                <Column>
                    <Controls>
                        <TextBox MaxLength="255" Type="Text" Size="Medium" XPath="Text"/>
                    </Controls>
                </Column>
            </Columns>
        </RowContent>
    </Editor>
</DataTable>