carbon-fields
carbon-fields copied to clipboard
Unable to remove complex fields containers with nested complex fields
Version
- Carbon Fields: 3.3.2 and 3.4.0-beta1
- WordPress: 5.7
- PHP: 7.4.21
Expected Behavior
When adding a nested complex field and also conditional logic to the fields within the nested complex field, all seems to work as expected until I try to remove the parent container with the complex field's remove icon.
Actual Behavior
When I click the icon to remove the parent container, it shows a lot of errors at the browser's console and the meta box content disappears and the only way to make the meta box showing again is by reloading the page and losing changes. Also, if I try to save the page in that state, after reloading I can see that the container that I tried to remove is still there.
Container definition
Container::make( 'post_meta', __( 'Product Options', WPD_CONFIGURATOR_TEXT_DOMAIN ) )
->where( 'post_type', '=', 'product' )
->set_priority( 'core' )
->add_fields( array(
Field::make( 'complex', self::$product_options_key, __( 'Setup product options', WPD_CONFIGURATOR_TEXT_DOMAIN ) )
->set_collapsed( TRUE )
->set_datastore( new SerializedMetaDataStore() )
->setup_labels( array(
'plural_name' => __( 'Fields', WPD_CONFIGURATOR_TEXT_DOMAIN ),
'singular_name' => __( 'Field', WPD_CONFIGURATOR_TEXT_DOMAIN ),
) )
->add_fields( array(
Field::make( 'text', 'title', __( 'Field title', WPD_CONFIGURATOR_TEXT_DOMAIN ) )
->set_required( true ),
Field::make( 'text', 'caption', __( 'Caption', WPD_CONFIGURATOR_TEXT_DOMAIN ) ),
Field::make( 'checkbox', 'extra', __( 'Is Extra Option', WPD_CONFIGURATOR_TEXT_DOMAIN ) )
->set_option_value( 'yes' ),
Field::make( 'checkbox', 'bulk_price', __( 'Used for bulk pricing', WPD_CONFIGURATOR_TEXT_DOMAIN ) ),
Field::make( 'select', 'type', __( 'Field type', WPD_CONFIGURATOR_TEXT_DOMAIN ) )
->set_options( array(
'img-radio' => __( 'Image Radio', WPD_CONFIGURATOR_TEXT_DOMAIN ),
'radio' => __( 'Radio Buttons', WPD_CONFIGURATOR_TEXT_DOMAIN ),
'color-picker' => __( 'Color Picker', WPD_CONFIGURATOR_TEXT_DOMAIN ),
'message' => __( 'Message', WPD_CONFIGURATOR_TEXT_DOMAIN ),
'image' => __( 'Image Upload', WPD_CONFIGURATOR_TEXT_DOMAIN ),
'variations' => __( 'From Variations', WPD_CONFIGURATOR_TEXT_DOMAIN ),
'add-ons' => __( 'Add-ons', WPD_CONFIGURATOR_TEXT_DOMAIN ),
) ),
Field::make( 'select', 'num_colors', __( 'Number of colors', WPD_CONFIGURATOR_TEXT_DOMAIN ) )
->set_options( array(
'1' => 1,
'2' => 2,
'3' => 3,
) )
->set_conditional_logic( array(
array(
'field' => 'type',
'value' => 'color-picker',
'compare' => '=',
),
) ),
Field::make( 'text', 'default', __( 'Default Value', WPD_CONFIGURATOR_TEXT_DOMAIN ) )
->set_help_text( __( 'Leave empty if no value should be selected by default', WPD_CONFIGURATOR_TEXT_DOMAIN ) )
->set_conditional_logic( array(
array(
'field' => 'type',
'value' => [ 'img-radio', 'radio', 'img-multi-check' ],
'compare' => 'IN',
),
) ),
Field::make( 'complex', 'options' )
->set_collapsed( TRUE )
->setup_labels( array(
'plural_name' => __( 'Options', WPD_CONFIGURATOR_TEXT_DOMAIN ),
'singular_name' => __( 'Option', WPD_CONFIGURATOR_TEXT_DOMAIN ),
) )
->set_conditional_logic( array(
array(
'field' => 'type',
'value' => [ 'variations', 'message', 'image', 'color-picker' ],
'compare' => 'NOT IN',
),
) )
->add_fields( array(
Field::make( 'image', 'img', __( 'Image', WPD_CONFIGURATOR_TEXT_DOMAIN ) )
->set_conditional_logic( array(
array(
'field' => 'parent.type',
'value' => [ 'img-radio', 'img-multi-check', 'add-ons' ],
'compare' => 'IN',
),
) ),
Field::make( 'text', 'name', __( 'Name', WPD_CONFIGURATOR_TEXT_DOMAIN ) )
->set_conditional_logic( array(
array(
'field' => 'parent.type',
'value' => [ 'img-radio', 'radio', 'img-multi-check', 'add-ons' ],
'compare' => 'IN',
),
) ),
Field::make( 'text', 'opt_value', __( 'Value', WPD_CONFIGURATOR_TEXT_DOMAIN ) )
->set_conditional_logic( array(
array(
'field' => 'parent.type',
'value' => [ 'img-radio', 'radio', 'img-multi-check', 'add-ons' ],
'compare' => 'IN',
),
) ),
Field::make( 'text', 'price', __( 'Price per unit', WPD_CONFIGURATOR_TEXT_DOMAIN ) )
->set_attribute( 'type', 'number' )
->set_attribute( 'min', 0 )
->set_attribute( 'step', 'any' )
->set_help_text( __( 'Leave empty if does not apply', WPD_CONFIGURATOR_TEXT_DOMAIN ) )
->set_conditional_logic( array(
'relation' => 'OR',
array(
'field' => 'parent.type',
'value' => [ 'add-ons', 'img-radio', 'radio' ],
'compare' => 'IN',
),
array(
'field' => 'parent.bulk_price',
'value' => 'yes',
'compare' => '!=',
),
) ),
) )
->set_header_template( '
<% if (name) { %>
Option: <%- name %>
<% } %>
' ),
) )
->set_header_template( '
<% if (title) { %>
Field: <%- title %>
<% } %>
' ),
) );
Steps to Reproduce the Problem
- Create the above container
- Add a new field
- Select the field type "Image Radio"
- Add some dummy options
- Save the meta box
- Try to remove the container created by using the icon