Control: Repeater - 10quality/wpmvc-addon-administrator GitHub Wiki

Controls used as field types to open and close a repeater wrapper, allowing multiple fields to get repeated upon the user indication.

Repeater

NOTE: Not all field controls are supported with the repeater.

Usage

This control doesn't need a specific id, so you can use uniqid() as field ID, see an example:

// Namespace and use statement...

class Settings extends Model
{
    // Class properties...

    protected function init()
    {
        // Other properties...

        $this->tabs = [
            'tab_id' => [
                'fields' => [

                    uniqid() => [
                        'type' => 'repeater_open',
                    ],

                    'field_id1' => [...],
                    'field_id2' => [...],

                    uniqid() => [
                       'type' => 'repeater_close',
                    ],
                    // Other fields...
                ],
            ],
        ];
    }
}

NOTE: When a repeater is opened, existing sections will be closed first. Sections and separators will close an opened repeater.

Each field wrapper inside a repeater will have an array as its value, for example:

$settings = Settings::instance();

// Print array
print_r( $settings->field_id1 );

Field options

This control allows for the following special field options:

// Namespace and use statement...

class Settings extends Model
{
    // Class properties...

    protected function init()
    {
        // Other properties...

        $this->tabs = [
            'tab_id' => [
                'fields' => [

                    'resolutions' => [
                        'type' => 'repeater_open',

                        // Repeater title. Default: repeater ID.
                        'title' => __( 'Resolutions', 'my-domain' ),

                        // Repeater description. Default: Empty
                        'description' => __( 'Screen (monitor) resolutions..', 'my-domain' ),

                        // Repeate/add button label. Default: 'Add'
                        'repeate_label' => __( 'Add resolution', 'my-domain' ),

                        // Repeate/add button icon (Font Awesome v4). Default: 'fa-plus-circle'
                        'repeate_icon' => 'fa-plus',

                        // Remove confirmation message. Default: 'Remove item?'
                        'remove_message' => __( 'Do you want to remove this resolution?', 'my-domain' ),
                    ],

                    'resolution_name' => [
                        'title' => __( 'Name' ),
                        'control' => [
                            'wide' => true,
                        ],
                    ],
                    'resolution_size' => [
                        'title' => __( 'Size' ),
                        'control' => [
                            'type' => 'number',
                            'attributes' => [
                                'min' => '360'
                            ],
                        ],
                    ],

                    uniqid() => [
                        'type' => 'repeater_close',
                    ],
                    // Other fields...
                ],
            ],
        ];
    }
}

Custom indexes

The repeater allows items to have their indexes edited and updated with string values, improving its handling during coding.

When the "Edit index" action button of a repeated item is clicked, a small editor will appear and will allow for the index to be changed: Index editor

String/custom indexes will appear with a small label/tag on top of an input: Custom indexes

Custom indexes can later be used in code like this:

$settings = Settings::instance();

// Access data using custom index
echo $settings->resolution_size['hd'];
echo $settings->resolution_size['4k'];

Remove repeated item

Click the "Remove" button to remove a repeated item.

Supported controls

Control
input
select
select2
textarea
switch
colorpicker
datepicker
datetimepicker
media