1. Home
  2. Docs
  3. WordPress Studio Framework
  4. How-To…
  5. Dependencies

Dependencies

Available dependency conditions are:

  • ==
  • !=
  • >=
  • >
  • <=
  • <
  • any
  • not-any

Simple Dependency Example

array(
  'id' => 'example-switcher',
  'type' => 'switcher',
  'title' => 'Example Switcher',
),
// Only show this field if the above field is "switched on/true"
array(
  'id' => 'example-text',
  'type' => 'text',
  'title' => 'Example Text',
  'dependency' => array('example-switcher', '==', 'true'),
),

Simple Dependency based on a Text Field Example

array(
  'id' => 'example-text',
  'type' => 'text',
  'title' => 'Example Text',
),
// Only show this field if the above field is not empty
array(
  'id' => 'example-text-2',
  'type' => 'text',
  'title' => 'Example Text Two',
  'dependency' => array('example-text', '!=', ''),
),

Simple Dependency based on a Select Field Example

array(
  'id' => 'example-select',
  'type' => 'select',
  'title' => 'Example Select',
  'placeholder' => 'Select an option',
  'options' => array(
    'opt1' => 'Option ONe',
    'opt2' => 'OPtion Two',
    'opt3' => 'Option Three',
  ),
),
//Only show this field if the above field is selecting Option Two
array(
  'id' => 'example-text',
  'type' => 'text',
  'title' => 'Example Title',
  'dependency' => array('example-select', '==', 'opt2'),
),

Dependency with Multiple Field Conditions Example

array(
  'id' => 'example-switcher',
  'type' => 'switcher',
  'title' => 'Switcher',
),
array(
  'id' => 'example-select',
  'type' => 'select',
  'title' => 'Example Select',
  'placeholder' => 'Select an option',
  'options' => array(
    'opt1' => 'Option One',
    'opt2' => 'Option Two',
    'opt3' => 'Option Three',
  ),
),

// only show this field if the switcher is on AND the selection is Option Two
array(
  'id' => 'example-text',
  'type' => 'text',
  'title' => 'Example Text',
  'dependency' => array(
    array('example-switcher', '==', 'true'),
    array('example-select', '==', 'opt2'),
  ),
),

//you can also do this with a shorter method
array(
  'id' => 'example-text',
  'type' => 'text',
  'title' => 'Example Text',
  'dependency' => array('example-switcher|example-select', '==|==', 'true|opt2'),
  ),
),

Dependency with Any Condition Example

array(
  'id' => 'example-select',
  'type' => 'select',
  'title' => 'Example Select',
  'placeholder' => 'Select an option',
  'options' => array(
    'opt1' => 'Option One',
    'opt2' => 'Option Two',
    'opt3' => 'Option Three',
  ),
),

// only show the following field if the example-select field equals EITHER Option Two or Option Three
array(
  'id' => 'example-text',
  'type' => 'text',
  'title' => 'Example Text',
  'dependency' => array( 'example-select', 'any', 'opt2,opt3'),
),

Dependency with a numeric condition example

array(
  'id' => 'example-spinner',
  'type' => 'spinner',
  'title' => 'Example Spinner',
),

//only show the following field if the above field is 100 or greater
array(
  'id' => 'example-text',
  'type' => 'text',
  'title' => 'Text',
  'dependency' => array('example-spinner', '>=', '100'),
),

Nested Dependency Example

array(
  'id' => 'example-switcher',
  'type' => 'switcher',
  'title' => 'If you switch this ON...',
),
array(
  'id' => 'example-select',
  'type' => 'select',
  'title' => '... and then select Blue',
  'placeholder' => 'Select a color',
  'options' => array(
    'blue' => 'Blue',
    'yellow' => 'Yellow',
    'green' => 'Green',
    'black' => 'Black',
  ),
),
array(
  'type' => 'notice',
  'style' => 'success',
  'content' => 'Success: Switched ON and selected Blue',
  'dependency' => array(
    array('example-switcher', '==', 'true'),
    array('example-select', '==', 'blue'),
  ),
),
Was this article helpful to you? Yes No

How can we help?