Populate select field after user input

• YorlinqNL

• July 4, 2020 at 2:16 am

I have an option page with some fields.

A repeater field that has 2 sub fields: DATE (datepicker field) and SESSION (select field with options: 1 and 2)

And also 2 textarea fields that will be used to populate the TIME field in a frontend form.

TIMES SESSION 1:
12:00
12:30
13:00
13:30
14:00
14:30
15:00

TIMES SESSION 2:
17:30
18:00
18:30
19:00
19:30
20:00
20:30

I have a frontend form with a DATE (datepicker) and a TIME (select) field.

When a user selects a DATE in frontend that matches a DATE stored in the option page the combining SESSION value will choose the TEXTAREA field to populate the TIME field.

Here is what I know and have…

How to use a TEXTAREA FIELD to populate the time field:

function yl_load_booking_time_session_1_field_choices( $field ) {
    
    // reset choices
    $field['choices'] = array();
    
    // get the textarea value from options page without any formatting
    $choices = get_field('booking_setting_time_session_1', 'booking_settings', false);

    // explode the value so that each line is a new array piece
    $choices = explode("\n", $choices);

    // remove any unwanted white space
    $choices = array_map('trim', $choices);

    // loop through array and add to field 'choices'
    if( is_array($choices) ) {
        foreach( $choices as $choice ) {
            $field['choices'][ $choice ] = $choice;
        }
    }

    // return the field
    return $field;
    
}

add_filter('acf/load_field/name=booking_time_session_1', 'yl_load_booking_time_session_1_field_choices');

function yl_load_booking_time_session_2_field_choices( $field ) {
    
    // reset choices
    $field['choices'] = array();
    
    // get the textarea value from options page without any formatting
    $choices = get_field('booking_setting_time_session_2', 'booking_settings', false);

    // explode the value so that each line is a new array piece
    $choices = explode("\n", $choices);
    
    // remove any unwanted white space
    $choices = array_map('trim', $choices);
    
    // loop through array and add to field 'choices'
    if( is_array($choices) ) {
        foreach( $choices as $choice ) {
            $field['choices'][ $choice ] = $choice;
        }
    }

    // return the field
    return $field;
    
}

add_filter('acf/load_field/name=booking_time_session_2', 'yl_load_booking_time_session_2_field_choices');

Getting the values of the repeater field in option page:

if(have_rows('booking_setting_exceptions', 'booking_settings')):
    while(have_rows('booking_setting_exceptions', 'booking_settings')): the_row();
    
        // Check: Booking Settings Exceptions Session
        if(get_sub_field('booking_setting_exceptions_session') == '2')
            continue;
        
        $date = date_i18n('Ymd', strtotime(get_sub_field('booking_setting_exceptions_date', 'booking_settings')));
        $session = get_sub_field('booking_setting_exceptions_session', 'booking_settings');
    
    endwhile;
endif;

But what I don’t now (and I’m sure its done by Javascript) is how to get/check the value of the live user input on the frontend form and use this value in an IF STATEMENT.

So I could do something like this:

If frontend form selected DATE == DATE stored in repeater field >> Check the combining SESSION value to populate the TIME field with TEXTAREA 1 or 2…

I hope I made myself clear…. My Javascript knowledge is very limited 🙁

• John Huebner

• July 10, 2020 at 10:22 pm

You are correct, this would need to be done with JavaScript and AJAX and it is not really simple enough to supply a code example. I have some examples of doing this type of thing, but nothing that will get you to what you want do very easily https://github.com/Hube2/acf-dynamic-ajax-select-example