Radio button input isn't saved when adding page to repeatable group

[jamiechong]

With the metabox below I have a problem saving the radio button. To repeat the issue:

1. Create a new post
2. Choose "template 1"
3. Add Page (add Row)
4. Choose "template 2"
5. Publish
6. The 2nd page doesn't even save. It's missing.
7. Add Page (add Row)
8. Choose "template 2"
9. Update
10. The 2nd page is still missing.

Note that if I have another field in there, say a text input, the 2nd page will save, but the radio button value doesn't get set.

Any thoughts on how I can fix this problem? I think it's the root to some other issues I'm having with adding rows/pages and then sorting...

    $meta_boxes[] = array(
        'id'         => CMB_PREFIX.'lb_settings',
        'title'      => 'Settings',
        CMB_POST_TYPE_KEY => array('lookbook'),
        'context'    => 'normal',
        'priority'   => 'high',
        'show_names' => true, 
        'fields'     => array(
            array(
                'id' => CMB_PREFIX.'lb_pages',
                'type' => 'group',
                //'description' => '',
                'options' => array(
                    'group_title' => 'Page {#}',
                    'add_button' => 'Add Page',
                    'remove_button' => 'Remove Page',
                    'sortable' => true,
                ),
                'fields' => array(
                    array(
                        'name' => 'Template',
                        'id' => CMB_PREFIX.'lb_page_template',
                        'type' => 'radio_inline',
                        'options' => array(
                            'template1' => 'Template 1',
                            'template2' => 'Template 2',
                            'template3' => 'Template 3',
                        )
                    ),
                )
            ),
        )
    );

[jamiechong]

One thing I just discovered is that when you Add another row/group, the radio button value isn't set.

This is a radio button from a group that saved properly:

<input type="radio" value="template2" id="_mm_lb_pages_0__mm_lb_page_template2" name="_mm_lb_pages[0][_mm_lb_page_template]" class="cmb2-option">

This is a radio button from the new group:

<input type="radio" value="" id="_mm_lb_pages_1__mm_lb_page_template2" name="_mm_lb_pages[1][_mm_lb_page_template]" class="cmb2-option" data-iterator="1">

The differences is that the newly added fields don't have a value attribute set but they include a data-iterator="1" attribute (probably unrelated?).

[jamiechong]

I believe I've found the problem and figured out a solution for this. It would be great if you could release this fix so any of your new updates of the plugin don't overwrite the changes I've hacked into a production site.

The problem is that after you clone a row, you empty all the values of the input items. This makes sense except for radio and checkbox fields.

So in cmb2.js I modified the following:

Line 351:

            $newInput
                .removeClass( 'hasDatepicker' )
                .attr( attrs );//.val('');

            if ($newInput.attr('type')!='radio' && $newInput.attr('type')!='checkbox') {
                $newInput.val('');
            }

Line 473 in the emptyValue function:

        $('input:not([type="button"],[type="radio"],[type="checkbox"]), textarea', row).val('');

[jtsternberg]

Should be good in the trunk branch. please test.

[tw2113]

@jamiechong any chance to have tested this one yet?

[jamiechong]

@tw2113 I can't say for sure. I'm no longer active on the project I was using this for. I think I switched to using the production CMB2, which means I was happy with the changes being merged in. It's been so long - can't honestly remember.

[tw2113]

No worries, thanks for responding. Going to close for the time being. If someone else comes back with similar issues, we can revisit.

[TheNewGuy16]

So I am still having a problem with radio buttons in group fields. I have a repeatable group field that assigns a layout with a radio button and all i want is for the radio buttons default to be checked so that the conditional statement would be true and the second wysiwyg field wont be showing. I am using cmb2 conditional for that part. So basically when you click the add new entry button in the group field the radio button is blank and the second wysiwyg field is showing but if click update page the radio buttons default gets check and the second wysiwyg field goes away. and then if you choose two columns it appears and again disappears if you select one column radio button so the conditionals are working but how do i get it to be set when add a new entry is clicked?

here is my code for the group field

$group_field_id = $cmb->add_field( array(
        'id'          => $prefix .'_section_content',
        'type'        => 'group',
        'description' => esc_html__( 'Add some sections', 'cmb2' ),
        'repeatable'  => true, 
        'options'     => array(
            'group_title'   => esc_html__( 'Section Entry {#}', 'cmb2' ), 
            'add_button'    => esc_html__( 'Add Another Entry', 'cmb2' ),
            'remove_button' => esc_html__( 'Remove Entry', 'cmb2' ),
            'sortable'      => true,
            'closed'     => true,
        ),
    ) );
    $cmb->add_group_field( $group_field_id, array(
        'name'         => esc_html__( 'Section Layout', 'cmb2' ),
        'desc'         => esc_html__( 'choose whether this section will be full width or 2 columns', 'cmb2' ),
        'id'           =>'_width',
        'type'         => 'radio',
        'options'          => array(
            'col-xs-12' => esc_html__( 'Full Width', 'cmb2' ),
            'col-xs-12 col-sm-5'   => esc_html__( 'Two Columns', 'cmb2' ),
        ),
        'default' => 'col-xs-12',
    ) );

    $cmb->add_group_field( $group_field_id,  array(
        'name'         => esc_html__( 'Text Content for column one', 'cmb2' ),
        'desc'         => esc_html__( 'add text content', 'cmb2' ),
        'id'           => '_text_one',
        'type'         => 'wysiwyg',
    ) );

    $cmb->add_group_field( $group_field_id,  array(
        'name'         => esc_html__( 'Text Content for column two', 'cmb2' ),
        'desc'         => esc_html__( 'add text content', 'cmb2' ),
        'id'           => '_text_two',
        'type'         => 'wysiwyg',
        'after_field' => "<input name='second_column' type='hidden' id='columns'
                          data-conditional-id='".wp_json_encode( array( $group_field_id, '_width' ) )."'
                          data-conditional-value='col-xs-12 col-sm-5'>",
        'attributes' => array(
            'required'               => false, // Will be required only if visible.
            'data-conditional-id'    => wp_json_encode( array( $group_field_id, '_width' ) ),
            'data-conditional-value' => 'col-xs-12 col-sm-5',
        ),
    ) );

Any help would be great.

Thanks

[tw2113]

Are the parts for CMB2 Conditional in this code snippet already? or is that being added/toggled elsewhere? Just wanting to make sure we have everything we need, other than CMB2 Conditional active, to recreate what you're experiencing.

[TheNewGuy16]

yeah they are the conditional-id and the conditional-value fields in the cmb2 markup. and for the wysigwyg editor i found that you have to add a after_field markup as well to get it to hide and show it.

[tw2113]

@jtsternberg is the cmb.cleanRow() js method supposed to clear out checked/selected states when doing a clone appending? That's what I'm getting when I check the JS, but definitely not what @TheNewGuy16 is wanting. Not sure if there's going to be way to override this.

[TheNewGuy16]

I mean if there isn't a way to override its fine. Since when you are filling out a section the user should check one or the other radio buttons for columns which in turn would hide or display the wsiwyg editor. I was just looking for a solution so that i could set a default in case the user didnt check the radio button. but even if the default radio button stayed checked i am not sure it would hide the wsiwyg editor untill the page was save anyway....So maybe a better option would be to hook into the update page button when the add new row button was clicked that would select the default radio button and hide the wsiwyg editor.

[tw2113]

Also curious if you could add your own snippet of js that checks after the ajax is done adding. Just throwing the thought out there, I lack an actual working solution for that one.