Reply To: Are conditional field settings possible?

• speakincode

• March 8, 2020 at 5:24 am

Thanks for the direction John.

I ended up building this out from scratch, hiding the table rows with CSS visibility: collapse and then toggling them to visibility: visible with click events on the button group.

The hardest part was digging through the core for an action to hook into, but I eventually found render_field_settings.

But after your direction, I was like, duh… of course, there’s already toggles like on the radio and checkboxes you mentioned as well as the built in Conditional Logic toggle. So I took a look at their acf_render_field_settings and found the conditions key. I implemented that on my example and it works perfect, no extra JS or anything.

Thank you for the reply and the direction, and all your help on this forum, you’re a rockstar!

For anyone else, here’s a working example:

// Show either the Button Text or Button Icon field setting
acf_render_field_setting($field, [
    'label'        => __('Button Type', 'acf'),
    'instructions' => '',
    'type'         => 'button_group',
    'name'         => 'button_type',
    'layout'       => 'horizontal',
    'choices'      => [
        'text' => __('Text', 'acf'),
        'icon' => __('Icon', 'acf')
    ]
]);

// Only show if Button Type field setting is set to Text
acf_render_field_setting($field, [
    'label'        => __('Button Text', 'acf'),
    'instructions' => '',
    'type'         => 'text',
    'name'         => 'button_text',
    // Here's the magic
    'conditions'   => [
        'field'    => 'modal_button_type',
        'operator' => '==',
        'value'    => 'text'
    ]
]);

// Only show if Button Type field setting is set to Icon
acf_render_field_setting($field, [
    'label'        => __('Button Icon', 'acf'),
    'instructions' => 'Select an Icon',
    'type'         => 'text',
    'name'         => 'button_icon',
    // Here's the magic
    'conditions'   => [
        'field'    => 'modal_button_type',
        'operator' => '==',
        'value'    => 'icon'
    ]
]);