Javascript populated field not saving data

• Phil Kurth

• August 7, 2013 at 12:09 am

Howdy

I’m currently using a repeater field to dynamically create sidebars. All is working well, except I need a way to assign them unique IDs that don’t change. I figured the best way would be to have a field for the ID, which would be populated and disabled by javascript.

I can get the field all populating with data, but when I hit save, no data is stored. I’m not quite sure where to go from here, as I would have thought that getting the data in the field would be enough.

Is there an extra step involved that I am missing?

Here is the jquery which successfully creates the data. The randString method is just a function I have elsewhere.

jQuery.fn.pdsCustomSidebarID = function ()
{
    var input = this.find('*[data-field_name="sidebar_id"] input');

    if( input.val() == '' ){
        input.prop('disabled', true).val( randString(6) );
    }

//    this.find('*[data-field_name="sidebar_id"] input').prop('disabled', true).val( randString(6) );
}

jQuery(document).ready(function ($)
{
    $(document).live('acf/setup_fields', function (e, div)
    {
        $(div).find('#acf-custom_sidebars .row').each(function ()
        {
            $(this).pdsCustomSidebarID();
        });
    });
});

Here is the field group registration array.

register_field_group(
      array(
            'id'         => 'acf_custom-sidebar-options-sidebars',
            'title'      => 'Custom Sidebar Options',
            'fields'     => array(
                  array(
                        'key'          => 'field_51fcb088cb9eb',
                        'label'        => 'Custom Sidebars',
                        'name'         => 'custom_sidebars',
                        'type'         => 'repeater',
                        'instructions' => 'Manage your custom sidebars here. Add and remove as many as you like, and assign them when creating/editing posts and pages. Setting your own custom sidebars will empower you to display unique sidebar content on any post or page, freeing you of the default single-sidebar in WordPress.',
                        'sub_fields'   => array(
                              array(
                                    'key'           => 'field_51fcb1efcb9ec',
                                    'label'         => 'Name',
                                    'name'          => 'sidebar_name',
                                    'type'          => 'text',
                                    'column_width'  => 20,
                                    'default_value' => '',
                                    'formatting'    => 'none',
                              ),
                              array(
                                    'key'           => 'field_51fcb234cb9ed',
                                    'label'         => 'Description',
                                    'name'          => 'sidebar_description',
                                    'type'          => 'text',
                                    'column_width'  => '',
                                    'default_value' => '',
                                    'formatting'    => 'none',
                              ),
                              array(
                                    'key'           => 'field_51fcb2ea21853',
                                    'label'         => 'Style',
                                    'name'          => 'sidebar_style',
                                    'type'          => 'select',
                                    'column_width'  => 12,
                                    'choices'       => array(
                                          'pds-default-style' => 'Grey box',
                                          'pds-plain-style'   => 'Plain',
                                    ),
                                    'default_value' => 'one',
                                    'allow_null'    => 0,
                                    'multiple'      => 0,
                              ),
                              array(
                                    'key'           => 'field_57fcb9efcb9ad',
                                    'label'         => 'ID',
                                    'name'          => 'sidebar_id',
                                    'type'          => 'text',
                                    'column_width'  => 10,
                                    'default_value' => '',
                                    'formatting'    => 'none',
                              ),
                        ),
                        'row_min'      => 0,
                        'row_limit'    => '',
                        'layout'       => 'table',
                        'button_label' => 'Add a new sidebar',
                  ),
            ),
            'location'   => array(
                  array(
                        array(
                              'param'    => 'options_page',
                              'operator' => '==',
                              'value'    => 'custom-sidebars',
                              'order_no' => 0,
                              'group_no' => 0,
                        ),
                  ),
            ),
            'options'    => array(
                  'position'       => 'normal',
                  'layout'         => 'no_box',
                  'hide_on_screen' => array(),
            ),
            'menu_order' => 1,
      )
);

• Elliot

• August 7, 2013 at 9:29 am

Hi @mishtershmart

Quite simply, a disabled input is never posted to the save function.

Maybe you should use the readonly attribute instead!

Easy

Cheers
E

• Phil Kurth

• August 7, 2013 at 9:56 am

Morning @elliot

Thanks for that. It’s always something so simple and basic that gets me, but you learn something every day.

Cheers
Phil