Table
Last updated: Dec 04, 2023

Introduction

The table element allows the user to add a table to the website. The table has a fixed amount of columns (specified when adding the element to a section), but can have an infinite number of rows. The content manager can add as many rows to the table as needed,

Adding the table element

To add a table to a section open the section where you need a table and click 'Add Element'. Now click 'Table'.

Specify a name for this element in the partial.

The column names should be a list seperated by semicolons for example Name;Function;Age.

Then click 'Add element'.

Populating the table

If the element 'Table' is present in a section, the content manager can populate a table by clicking 'Add row'. Then the user can insert values into the columns provided by the previous step. The user can also delete a row if needed and change previously added values.

Display the table

To display the table in your view files, you can use the foreach function of PHP. The following example demonstrates how to create a simple table based on the examples given earlier in this documentation.

<table>
    <tr>
        <td><b>Name</b></td>
        <td><b>Function</b></td>
        <td><b>Age</b></td>
    </tr>
    <?php foreach($employees as $tableRow):?>
        <tr>
            <td><?=$tableRow['Name'];?></td>
            <td><?=$tableRow['Function'];?></td>
            <td><?=$tableRow['Age'];?></td>
        </tr>
    <?php endforeach; ?>
</table>

The table data has been added to an array with the same name as the name of the element, in this case: $employees. The keys of the array have the same name as the column names (case sensitive), in this case: Name, Function and Age. So this piece of code will show all employees listed in the CMS.

In this example, we have chosen to hard-code the first row of the table with the columns names, but you can also dynamicly create this row by using the PHP function array_keys on $employees.