Tab Class - HTML Tab Generator

The Tab class simplifies the creation of tabbed navigation interfaces in web applications. It automates URL query string handling and active state management.

Namespace

Kotchasan\Tab

Generated Structure

The class generates the following HTML structure:

<div class="inline">
  <div class="writetab">
    <ul id="tab_id">
      <li class="select"><a href="...">...</a></li>
      <li><a href="...">...</a></li>
    </ul>
  </div>
</div>

Public Methods

__construct()

Initialize the Tab instance

public function __construct(string $id, string $url, array $items = [])

Parameters:

• $id - ID for the <ul> element.
• $url - Base URL of the current page (used for generating links for tabs without specific URLs).
• $items - Initial array of tab items.

add()

Add a tab item

public function add(string $id, string $title, string $url = '', string $target = null)

Parameters:

• $id - Tab ID (used for switching selection via tab=...).
• $title - Label text for the tab.
• $url - Custom URL (If empty, it uses Base URL + tab=$id).
• $target - HTML target attribute (e.g., _blank).

render()

Generate HTML code

public function render(string $select = ''): string

Parameters:

• $select - ID of the tab to be marked as active (Defaults to the first item if empty).

Returns: HTML String

getSelect()

Get the ID of the currently active tab (available after render is called)

public function getSelect(): string

Returns: Active Tab ID

Usage Example

// Create Tab object
// 'my_tab' is the ID of <ul>
// 'index.php?module=home' is the Base URL
$tab = new \Kotchasan\Tab('my_tab', 'index.php?module=home');

// Add tabs
$tab->add('first', 'Home'); // Link becomes index.php?module=home&tab=first
$tab->add('second', 'Page Two', 'index.php?module=second'); // Custom link
$tab->add('third', 'Google', 'https://google.com', '_blank'); // External link

// Render HTML with 'first' selected
echo $tab->render('first');

// Get selected ID
echo $tab->getSelect(); // "first"

Notes

• If $url in add is empty, the system automatically appends a tab parameter to the Base URL, correctly handling ? and & separators.
• The CSS class writetab controls styling, and the active item receives the select class.

File Size: 120 lines