Redux

# Sortable

The Sortable field allows for an unlimited array of drag-and-drop text box inputs or check boxes.

Table of Contents

# Arguments

Name Type
Default
 Description
type string sortable Value identifying the field type.
options array Array of key pair data defining the input objects. The key represents the object's ID. The second the display text. See the example.
label bool false Flag to display values before text areas when mode is not checkbox.
mode string text Sets the mode of the input HTML. Options allowed are text or checkbox.

Also See

# Build Config

Build a Custom Configuration →
Changes you make to this form will be reflected in the generated code.
Field visibility requirements.
 
Redux::set_field( 'OPT_NAME', 'SECTION_ID', array(
    'type' => 'sortable'
) );

# Example Config

// Checkbox mode
Redux::set_field( 'OPT_NAME', 'SECTION_ID', array(
    'id'       => 'text-sortable',
    'type'     => 'sortable',
    'title'    => esc_html__('Sortable Text Option', 'your-textdomain-here'),
    'subtitle' => esc_html__('Define and reorder these however you want.', 'your-textdomain-here'),
    'desc'     => esc_html__('This is the description field, again good for additional info.', 'your-textdomain-here'),
    'mode'     => 'checkbox',
    'options'  => array(
        '1'     => 'Item 1',
        '2'     => 'Item 2',
        '3'     => 'Item 3',
    ),
    // For checkbox mode
    'default' => array(
        '1' => false,
        '2' => true,
        '3' => false
    ),
) );

# Text mode


Redux::set_field( 'OPT_NAME', 'SECTION_ID', array(
    'id'       => 'text-sortable',
    'type'     => 'sortable',
    'title'    => esc_html__('Sortable Text Option', 'your-textdomain-here'),
    'subtitle' => esc_html__('Define and reorder these however you want.', 'your-textdomain-here'),
    'desc'     => esc_html__('This is the description field, again good for additional info.', 'your-textdomain-here'),
    'mode'     => 'text',
    'options' => array(
         '1' => 'Item number one',
         '2' => 'Number two here',
         '3' => 'Three strikes, yer out!',
    ),
) );

# Example Usage

This example is based on the example usage provided above. Be sure to change $redux_demo to the value you specified in your opt_name argument.

global $redux_demo;

echo 'Text 1 value' . $redux_demo['text-sortable']['1'];
echo 'Text 2 value' . $redux_demo['text-sortable']['2'];
echo 'Text 3 value' . $redux_demo['text-sortable']['3'];

← Sorter →