{"id":30494,"date":"2017-08-21T19:17:24","date_gmt":"2017-08-21T11:17:24","guid":{"rendered":"http:\/\/localhost\/help\/?page_id=30494"},"modified":"2024-08-30T13:26:40","modified_gmt":"2024-08-30T05:26:40","slug":"data-table-4-5-2","status":"publish","type":"page","link":"https:\/\/oihelp.corporate.ifs.com\/help\/p2-explorer\/explorer-studio\/controls\/data-table\/data-table-4-5-2\/","title":{"rendered":"Data Table (4.5.2)"},"content":{"rendered":"\n

This article applies to versions 4.5.2 and later of P2 Explorer. For more, see Release History<\/a>. For the latest help, see Data Table<\/a>.<\/p>\n

Overview<\/h2>\n

The data table displays data in tabular format. The page designer can configure many settings, such as display columns, sorting, grouping, filtering - which are then available to users in display mode.<\/p>\n

There are also data table configurations that are set in design time, for example column aggregation (such as sum, average, minimum), column titles (headers) and the table footer.<\/p>\n

<\/a>

A Data Table in Display Mode<\/p><\/div>\n

A data table can be configured to display tags, ad-hoc calculations, attribute values for various entities, or columns from a relational dataset.<\/p>\n

Jump to: Options for Configuring a Data Table's Data<\/a>.<\/p>\n

Related: Using a Data Table<\/a> in display mode, and Adding a Data Table style<\/a><\/p>\n

Functionality of a Data Table<\/h3>\n

The data table can be configured to provide several options to the user, making this a very interactive page component. For example, a user can sort, group, or pin columns, if these options have been configured during page design.<\/p>\n

Here is a brief overview of how the designed data table appears in display mode; for more details refer to the Using data tables<\/a> article.<\/p>\n

<\/a><\/p>\n

 <\/p>\n

\n

Quick Start<\/h2>\n

This section explains how to set up a very basic data table, using Tag data.<\/p>\n

\"\"<\/a><\/p>\n

Related<\/strong>: Using Tag Data<\/a><\/p>\n

1. Open an Explorer page in Studio, or prepare a new Studio page<\/a>.<\/p>\n

2. Drag a Data Table onto the page and resize to make it wider.<\/p>\n

\"\"<\/a><\/p>\n

Click on the Data Table to open the Component Editor.<\/strong><\/p>\n

In this example, we've used the FastSin\u00a0<\/i>tag, and have left the data collection parameters (Sample Method, Sample Interval, Start Time and End Time) using the page defaults. You can use a different tag, if you prefer.<\/p>\n

3. Add tag data to the table, using the Data Selector for Tags<\/a>.<\/p>\n

<\/i>TOP TIP<\/span><\/p>\n

You can drag a tag directly into the edit box, from the Tag Navigator.<\/p>\n<\/div>\n

 <\/p>\n

\"\"<\/a><\/p>\n

4. Click Add Column<\/strong>.<\/p>\n

\"\"<\/a><\/p>\n

5. Click New Column<\/strong> to expand the new column details.<\/p>\n

6. In the Header<\/strong> text box, type a suitable column header.<\/p>\n

7. In the Column<\/strong> select a data column.<\/p>\n

\"\"<\/a><\/p>\n

8. Now add the timestamp column in the same way (Header:<\/strong> Timestamp, Column:<\/strong> Timestamp, Column Type:<\/strong> Datetime, Column Format:<\/strong> Full Date) .<\/p>\n

\"\"<\/a><\/p>\n

That's all - you now have a data table with data.<\/p>\n

Click the Preview \"preview\"<\/a> button on the Studio toolbar to see what your page will look like in run-time.<\/p>\n

\"\"<\/a><\/p>\n

 <\/p>\n

\n

Tutorials<\/span><\/h2>\n

If you're unfamiliar with the process of building pages, read the article\u00a0Building an Explorer Page<\/a>.<\/p>\n

For the data table, we have four tutorials, each following from the previous one.<\/p>\n