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

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

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:

class Post extends Model
{
    // Class properties and methods...

    protected function init()
    {
        $this->metaboxes = [
            'metabox_id' => [
                '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:

$post = Post::find( $id );

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

Field options

This control allows for the following special field options:

class Post extends Model
{
    // Class properties and methods...

    protected function init()
    {
        $this->metaboxes = [
            'metabox_id' => [
                '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' ),

                                // Hide and show support
                                'show_if' => [...],
                                'hide_if' => [...],
                            ],

                            '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:

$post = Post::find( $id );

// Access data using custom index
echo $post->resolution_size['hd'];
echo $post ->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