nuBuilder Forum

Posted: **Fri Aug 01, 2025 1:41 pm**

A new function has been added: nuAddActionCheckbox() — a unified, visually integrated alternative to the basic checkbox+label combination.

nu_action_checkbox.png

This function allows you to easily add styled checkboxes to the nuActionHolder (or another specified location), consistent with nuAddActionButton(), supporting session/local/property storage and user interaction callbacks.

This is especially useful for filters, toggles, or persistent UI settings in forms and dashboards.

Key Features:

Consistent look and feel with nuAddActionButton() using FontAwesome icons.
Storage options: 'property' (default), 'session', or 'local' to remember checkbox state.
onChecked callback lets you define custom logic when the checkbox is toggled.
Can be placed after any existing element using insertAfterElement.

Syntax:
nuAddActionCheckbox(settings)

Settings object:

Code: Select all

{
    id: 'myCheckbox', // Optional unique ID
    text: 'Show Archived', // Label text next to the checkbox
    checked: true, // Initial state (true | false)
    storage: 'session', // 'property' | 'session' | 'local'
    insertAfterElement: 'someElementID', // Optional: insert after specific DOM element
    onChecked: function (checked) {
        // Your custom logic here
    }
}

Examples:

Add a checkbox to filter archived records, saved in session storage:

Code: Select all

nuAddActionCheckbox({
    id: 'showArchived',
    text: 'Show Archived',
    storage: 'session',
    checked: false,
    onChecked: function (checked) {
       // code here...
    }
});

Visual Difference:

Unlike traditional checkboxes created manually with <input type="checkbox"> and label tags, nuAddActionCheckbox() uses a styled label with <i> icons to match nuBuilder’s UI, ensuring visual harmony and clarity in the action area.

nuBuilder Forum

[Added] JS function nuAddActionCheckbox() (nuBuilder 4.9.1)

[Added] JS function nuAddActionCheckbox() (nuBuilder 4.9.1)