📚 DataTable UI Shell – Code Documentation

1. Page Structure (`dtTest.php`)

• Header: Dropdown to select views + input to save custom views
• Controls: Column visibility checkboxes, theme toggle
• Table Container: Rendered as Bootstrap card with responsive layout

2. Data Loading

On document.ready, data is fetched from products.json. Table headers and rows are rendered dynamically to support new columns without rewriting the HTML.

3. `dt.js` Functions

• initDataTable(selector, options): Core function to initialize the DataTable with optional features like column filters, column hiding, tooltips, and column reordering.
• saveCustomView(name): Stores user's custom layout (hidden columns, filter values, column order) in localStorage.
• applyCustomView(name): Rehydrates a saved view and reapplies column state, filters, and order.
• updateViewSelector(): Populates view dropdown with all saved custom views.

4. Settings Persistence

Filters, column visibility, theme, and reordering are stored in localStorage using unique keys per table.