Tab Control

You can easily place a tab control within any web page by using the special <s:tab_control> HTML tag, making the tab control static. However, there may be times where you wish to make the tab control dynamic and extensible, allowing other developers to add tab pages into it from within their own packages. This is useful for things such as managing a user profile, a transaction, and so on. You can create a tab control by using the create tab-control CLI command, such as:

apex create tab-control <PACKAGE> <ALIAS>

apex create tab-control my-shop order

Using the above example a new file has been created at /src/MyShop/Opus/TabControls/Order.php, which only contains one method named process() that is executed every time the tab control is displayed. A new directory is also created at /src/MyShop/Opus/TabControls/order/.

The PHP class contains one property named $tab_pages, which is an associative array consisting of all tab pages within the tab control. Keys are the alias / filename of each tab page, while the values are the name of the pages to display within the web browser, for example:

public array $tab_pages = [
    'General' => 'General',
    'Order' => 'Order Details',
    'Payment' => 'Payment Information'
];

Using the above array as an example, you may create files named General.html, Order.html and Payment.html within the directory at /src/MyShop/Opus/TabControls/Order/. The contents of these .html files will be used as the contents of the tab pages when they're displayed within the web browser.

The processing / value gathering of any merge fields or if / foreach tags included within the .html templates should be handled via the process() method of the PHP class, allowing the entire tab control including all functionality to be easily moved to any other page within the system. The constructor within the PHP class contains one property called $attr, which is an assosiative array of all attributes within the HTML tag that triggered displaying of the tab control.

Displaying Tab Controls on Web Pages

You can display a tab control on any page rendered by Apex by placing a single HTML tag, such as:

<s:function alias="display_tab_control" tab_control="<PACKAGE>.<ALIAS>">

You may also include any additional attributes within the HTML tag, which will be available within the $attr property of the PHP class, such as:

<s:function alias="display_tab_control" tab_control="<PACKAGE>.<ALIAS>" type="premium" order_id="~order_id~">

Using the tab control created above as an example, you would display that tab control with the tag:

<s:function alias="display_tab_control" tab_control="my-shop.order" order_id="~order_id~">