customify_conditional_fields.php

<?php
/**
 * This shows how the field visibility can be changed conditionally between fields values
 **/
function example_add_customify_fold_example_options( $options ) {

	$folding_examples_section = array(
		'folding_section' => array(
			'title'   => esc_html__( 'Folding', 'example' ),
			'options' => array(
				'first_parent' => array(
					'type'    => 'checkbox',
					'label'   => esc_html__( 'First Parent ', 'example' ),
					'default' => 1,
				),

				'second_parent' => array(
					'type'    => 'checkbox',
					'label'   => esc_html__( 'Second Parent', 'example' ),
					'default' => 0,
				),

				'first_child' => array(
					'type'    => 'checkbox',
					'label'   => esc_html__( 'Child Field', 'example' ),
					'desc'   => esc_html__( 'This field is visible only when the first parent option is on', 'example' ),
					'default' => 1,
					'show_on' => array(
						'id' => 'first_parent',
						'value' => 1,
					)
				),

				'plain_simple_example' => array(
					'type'    => 'checkbox',
					'label'   => esc_html__( 'An non-associative example', 'example' ),
					'default' => 1,
					'show_on' => array( 'first_parent' ) // the show_on config can also be non-assiciative since the value is 1 by default
				),

				'plain_simple_example_but_multiple' => array(
					'type'    => 'checkbox',
					'label'   => esc_html__( 'Multiple parents', 'example' ),
					'desc'   => esc_html__( 'This field depends on both parents', 'example' ),
					'default' => 1,
					'show_on' => array( 'first_parent', 'second_parent' )
				),

				'nonassociative_parent' => array(
					'type'    => 'checkbox',
					'label'   => esc_html__( '4th Child Field', 'example' ),
					'desc'   => esc_html__( 'This Child depends on a non-associative parent', 'example' ),
					'default' => 1,
					'show_on' => array(
						array(
							'id' => 'plain_simple_example',
							'value' => 1,
						)
					)
				),

				'ranger_parent'  => array(
					'type'        => 'range',
					'label'       => esc_html__( 'A distance', 'example' ),
					'default'     => 60,
					'input_attrs' => array(
						'min'          => 0,
						'max'          => 140,
						'step'         => 1,
						'data-preview' => true,
					),
				),

				'ranger_child' => array(
					'type'    => 'checkbox',
					'label'   => esc_html__( 'Visible while in range', 'example' ),
					'desc'   => esc_html__( 'This field is visible only when the range has a value between 1 and 30', 'example' ),
					'default' => 1,
					'show_on' => array(
						'id' => 'ranger_parent',
						'between' => array(1, 30),
					)
				),

				'radio_field_parent'                    => array(
					'type'    => 'radio',
					'label'   => esc_html__( 'Radio field', 'example' ),
					'default' => 'first',
					'choices' => array(
						'first' => esc_html__( 'First', 'example' ),
						'second' => esc_html__( 'Second', 'example' ),
						'third'  => esc_html__( 'Third', 'example' ),
					)
				),

				'first_radio_dependent'                    => array(
					'type'    => 'text',
					'label'   => esc_html__( 'Radio dependent Text', 'example' ),
					'desc'   => esc_html__( 'This field is visible when the radio has the first choice on', 'example' ),
					'default' => 'First',
					'show_on' => array(
						'id' => 'radio_field_parent',
						'value' => 'first',
					)
				),

				'select_field_parent'                    => array(
					'type'    => 'select',
					'label'   => esc_html__( 'Select field', 'example' ),
					'default' => 'first',
					'choices' => array(
						'first' => esc_html__( 'First', 'example' ),
						'second' => esc_html__( 'Second', 'example' ),
						'third'  => esc_html__( 'Third', 'example' ),
					)
				),

				'first_select_dependent'                    => array(
					'type'    => 'text',
					'label'   => esc_html__( 'Select dependent Text', 'example' ),
					'default' => 'First',
					'show_on' => array(
						'id' => 'select_field_parent',
						'value' => 'first',
					)
				),

				'multiple_dependencies' => array(
					'type'    => 'text',
					'label'   => esc_html__( 'Multi dependencies', 'example' ),
					'desc'   => esc_html__( 'This field is visible when the radio is first(or second) and the radio is first(or third)', 'example' ),
					'default' => 'First',
					'show_on' => array(
						array(
							'id' => 'radio_field_parent',
							'value' => array('first' , 'second'),
						),
						array(
							'id' => 'select_field_parent',
							'value' => array('first' , 'third'),
						)
					)
				),

			),
		),
	);

	//make sure we are in good working order
	if ( empty( $options['sections'] ) ) {
		$options['sections'] = array();
	}

	//append the general section
	$options['sections'] = $options['sections'] + $folding_examples_section;

	return $options;
}
add_filter( 'customify_filter_fields', 'example_add_customify_fold_example_options', 12, 1 );