How Do I ... Create Sortable/Searchable Tables of Data?
Depending on your needs there are options for creating sortable and/or searchable tables of data in Ensemble. The documentation below will give you examples with standard options supported by the scripts in the CMS.
NOTE: You can only have one sortable table per page. You can have multiple data tables per page.
If you are creating the table in HTML in an external editor:
Tables must contain the following structure in order to enable the sorting and searching functionality:
<th> ... </th> [any number of headers]
<td> ... </td> [any number of rows whose columns match the number of headers]
Tables must contain a <thead> section with <th> tags in a single row and a <tbody> section with as many rows as needed with a matching number of columns to headers (there should be a <td></td> in each row to match the number of <th></th> in the header row).
You will need to use the HTML component and the "vt-datatable-formatted" class for sortable/searchable data table functions or the "vt-tablesorter-formatted" class for the sorted table functions.
NOTE: There is a "-formatted" that is added to the class for data and sort tables that are pre-formatted. If you use the Text component class you will have doubled up headers.