Custom Fields
Re-Envisioned
Support Meta Box Conditional Logic Conditional logic not working with clones in groups

This topic contains 12 replies, has 2 voices, and was last updated by  Anh Tran 1 year, 2 months ago.

  • Creator
    Topic
  • #8459

    npp
    Participant
    
    $prefix = '_something_';
    
    $meta_boxes[] = array(
        'title'      => 'Box settings',
        'post_types' => 'page',
        'fields'     => array(
            array(
                'id'            => $prefix . 'test',
                'name'          => 'Image or video boxes',
                'type'          => 'group',
                'clone'         => true,
                'sort_clone'    => true,
                'collapsible'   => true,
                'group_title'   => 'Box #{#}',
                'save_state'    => true,
    
                'fields' => array(
                    array(
                        'name'              => 'Image or video?',
                        'id'                => 'type',
                        'type'              => 'radio',
                        'options'           => [ 'img' => 'Image', 'vid' => 'Video', ],
                        'std'               => 'img',
                        'inline'            => false,
                    ),
                    array(
                        'id'                => 'image',
                        'name'              => 'Choose an image',
                        'type'              => 'image_advanced',
                        'force_delete'      => false,
                        'max_file_uploads'  => 1,
                        'max_status'        => false,
                        'image_size'        => 'thumbnail',
                        'visible'           => [ 'type', 'img' ], // <-- not working
                    ),
                    array(
                        'id'                => 'video',
                        'name'              => 'Choose a video',
                        'type'              => 'video',
                        'force_delete'      => false,
                        'max_file_uploads'  => 1,
                        'max_status'        => false,
                        'visible'           => [ 'type', 'vid' ], // <-- not working
                    ),
                ),
            ),
        ),
    );
    

    Problem #1
    The conditional logic is not working. This is probably due to it being a cloneable group and it can’t lookup the right cloneable field. This is what it’s looking for:
    {"visible":{"when":[["type","=","img"]],"relation":"and"}}
    when it should be looking for:
    {"visible":{"when":[["_something_test[0][type]","=","img"]],"relation":"and"}}

    Problem #2
    When cloning the group, _something_test[X][type] is forgotten. If I set it to be “img” and clone the group, the previous box (#1) gets forgotten and “img” is no longer checked/selected.

    Question:
    How do I use conditional logic in groups and have them save correctly?

Viewing 10 replies - 1 through 10 (of 12 total)
  • Author
    Replies
  • #8478

    Anh Tran
    Keymaster

    Hi,

    I’ve just checked your code and found that the problem is the ID of the radio field, which is type. As this is the radio field, there are actually 2 inputs with the same name. The JavaScript tries to *guess* the field using this selector [name*="type"]. It’s ambiguous, and actually it returns *another WordPress field*, which is the post_type (a hidden input).

    I’d suggest using prefix for your field’s ID (as stated in the documentation). It’s a good way to keep the field ID/name unique, and thus make the selector works. I’ve tried changing the ID from type to type123 and it works.

    Please try and let me know how it goes.

    #8484

    npp
    Participant

    Yes I understand what you’re saying. But I have tried, and it is the same result. Try this code:

    
    $prefix = '_something_';
    
    $meta_boxes[] = array(
        'title'      => 'Box settings',
        'post_types' => 'page',
        'fields'     => array(
            array(
                'id'          	=> $prefix . 'test',
                'name'        	=> 'Image or video boxes',
                'type'        	=> 'group',
                'clone'       	=> true,
                'sort_clone'  	=> true,
                'collapsible' 	=> true,
                'default_state'	=> 'collapsed',
                'group_title' 	=> 'Box #{#}',
                'save_state' 	=> true,
    
                'fields' 		=> array(
    				array(
    				    'name'    			=> 'Image or video?',
    				    'id'      			=> $prefix . 'type123',
    				    'type'    			=> 'radio',
    				    'options' 			=> [ 'img' => 'Image', 'vid' => 'Video', ],
    				    'std'				=> 'img',
    				    'inline' 			=> false,
    				),
    				array(
    				    'id'               	=> $prefix . 'image',
    				    'name'             	=> 'Choose an image',
    				    'type'             	=> 'image_advanced',
    				    'force_delete'     	=> false,
    				    'max_file_uploads' 	=> 1,
    				    'max_status'       	=> false,
    				    'image_size'       	=> 'thumbnail',
    				    'visible' 			=> [ $prefix . 'type', 'img' ], // <-- not working
    				),
    				array(
    				    'id'               	=> $prefix . 'video',
    				    'name'             	=> 'Choose video',
    				    'type'             	=> 'video',
    				    'force_delete'     	=> false,
    				    'max_file_uploads' 	=> 1,
    				    'max_status'       	=> false,
    				    'visible' 			=> [ $prefix . 'type', 'vid' ], // <-- not working
    				),
                ),
            ),
        ),
    );
    

    That should work, but it doesn’t. The reason I didn’t have a $prefix in there was because it’s a cloned group, it should *know* better. _something_test[0][type] isn’t post_type. But okay, if we don’t want to add logic to handle that, at least it should work with prefixed fields. But it doesn’t.

    Problem 1 “sort of” disappears, the ‘default_state’ doesn’t work and one of the two alternatives are visible on page load until you expand. Then it disappears. Then if you select “Image”, set an image, and “clone”, the setting is lost (see problem #2).

    Don’t know what to do. I’ll show you what happens here:
    https://drive.google.com/file/d/18lzVdnsD8FrKVUlYgJzDNcF1v4lUSVB7/view?usp=sharing

    #8485

    npp
    Participant

    Hmm can’t edit the post. So the code is currently:

    
    $prefix = '_something_';
    
    $meta_boxes[] = array(
        'title'      => 'Box settings',
        'post_types' => 'page',
        'fields'     => array(
            array(
                'id'          	=> $prefix . 'test',
                'name'        	=> 'Image or video boxes',
                'type'        	=> 'group',
                'clone'       	=> true,
                'sort_clone'  	=> true,
                'collapsible' 	=> true,
                'default_state'	=> 'collapsed',
                'group_title' 	=> 'Box #{#}',
                'save_state' 	=> true,
    
                'fields' 		=> array(
    				array(
    				    'name'    			=> 'Image or video?',
    				    'id'      			=> $prefix . 'type123',
    				    'type'    			=> 'radio',
    				    'options' 			=> [ 'img' => 'Image', 'vid' => 'Video', ],
    				    'std'				=> 'img',
    				    'inline' 			=> false,
    				),
    				array(
    				    'id'               	=> $prefix . 'image',
    				    'name'             	=> 'Choose image',
    				    'type'             	=> 'image_advanced',
    				    'force_delete'     	=> false,
    				    'max_file_uploads' 	=> 1,
    				    'max_status'       	=> false,
    				    'image_size'       	=> 'thumbnail',
    				    'visible' 			=> [ $prefix . 'type123', 'img' ], // <-- not working
    				),
    				array(
    				    'id'               	=> $prefix . 'video',
    				    'name'             	=> 'Choose video',
    				    'type'             	=> 'video',
    				    'force_delete'     	=> false,
    				    'max_file_uploads' 	=> 1,
    				    'max_status'       	=> false,
    				    'visible' 			=> [ $prefix . 'type123', 'vid' ], // <-- not working
    				),
                ),
            ),
        ),
    );
    

    And the above video applies. As you can see, it does not function as intended. It resets the value when you clone as for radio, it shows image selection by default outside collapse although being in collapsed state by default.. Yeah I can’t get this to work.

    #8488

    Anh Tran
    Keymaster

    Oh, I see. My previous reply was for another problem (show/hide the image/video field when selecting an option). I’ll check this bug and reply soon.

    #8514

    npp
    Participant

    Any updates on this issue? If you need me to try something, let me know.

    #8531

    Anh Tran
    Keymaster

    I found the problem. The Conditional Logic applies CSS (display: block) inline to the field, which overwrites the CSS of the Group extension (collapsed state). I’ve just updated the Group extension. Please try and let me know how it goes.

    #8532

    npp
    Participant

    Sorry to say, it still doesn’t work as expected. The field is hidden now, and visible as it should be. But it still *forgets* when you hit clone.

    This is still the code used to test with:

    
    $prefix = '_something_';
    
    $meta_boxes[] = array(
        'title'      => 'Box settings',
        'post_types' => 'page',
        'fields'     => array(
            array(
                'id'          	=> $prefix . 'test',
                'name'        	=> 'Image or video boxes',
                'type'        	=> 'group',
                'clone'       	=> true,
                'sort_clone'  	=> true,
                'collapsible' 	=> true,
                'default_state'	=> 'collapsed',
                'group_title' 	=> 'Box #{#}',
                'save_state' 	=> true,
    
                'fields' 		=> array(
    				array(
    				    'name'    			=> 'Image or video?',
    				    'id'      			=> $prefix . 'type123',
    				    'type'    			=> 'radio',
    				    'options' 			=> [ 'img' => 'Image', 'vid' => 'Video', ],
    				    'std'			=> 'img',
    				    'inline' 			=> false,
    				),
    				array(
    				    'id'               	=> $prefix . 'image',
    				    'name'             	=> 'Choose image',
    				    'type'             	=> 'image_advanced',
    				    'force_delete'     	=> false,
    				    'max_file_uploads' 	=> 1,
    				    'max_status'       	=> false,
    				    'image_size'       	=> 'thumbnail',
    				    'visible' 			=> [ $prefix . 'type123', 'img' ],
    				),
    				array(
    				    'id'               	=> $prefix . 'video',
    				    'name'             	=> 'Choose video',
    				    'type'             	=> 'video',
    				    'force_delete'     	=> false,
    				    'max_file_uploads' 	=> 1,
    				    'max_status'       	=> false,
    				    'visible' 			=> [ $prefix . 'type123', 'vid' ],
    				),
                ),
            ),
        ),
    );
    

    This is a short video showcasing the issue at hand:
    https://drive.google.com/file/d/1YKq_43Gz6hjl9FDMFI5PnTC20Z-fNtJd/view?usp=sharing

    As you can see, as soon as I select “+ Add more”, the previous is “forgotten”.

    #8539

    Anh Tran
    Keymaster

    I got it. The problem is the cloning “radio” field. I’ve fixed it here. Please try and let me know how it goes.

    Thanks

    #8542

    npp
    Participant

    All right, I replaced the contents of js/clone.js in the main MetaBox plugin. So far, it does work in regards to not *forgetting* the previous box radio settings when cloning. However, one small issue still remains – it ignored the ‘std’ for the radio on clone.

    So in this case, I have 'std' => 'img' and it’s only respected for the first page load but not on clone. Seeing as they are radio inputs, having one pre-filled is a pretty common feat in my opinion. It’s either Image or Video, must be one or the other.

    Other than that, it works. Thank you!

    #8545

    Anh Tran
    Keymaster

    I got it. In this case, please add 'clone_default' => true to the field and the std value will be cloned, too.

Viewing 10 replies - 1 through 10 (of 12 total)

The topic ‘Conditional logic not working with clones in groups’ is closed to new replies.