Showing and populating text fields based on user's choice

• wbjkr

• February 9, 2018 at 1:39 am

Hello,

I’m pretty new to ACF, but I think it’s really awesome… I need some help, though, realizing a project for a customer.

I’m trying to populate a select field using values from a list, the options page, or something along the lines. Best would be an options page, since my customer could then add their own values.

Now, based on the selection the user has made, it should then display a couple text fields that are also populated by a list or something along the lines.

The select field should be a list of locations:

Location 1
Location 2
Location 3
…

The text fields should be addresses:

123-ZIPCODE, City, Street

The important part is, I don’t want to change the field_id, it should always be the same, so the content of the text fields should dynamically change based on the selection the user has made.

I know I can show fields based on a selection the user has made, but I really don’t know how to do this dynamically.

I’ve read in your forums, but I have never done anything using AJAX before. Also, the examples given by John Huebner’s GitHub page are for returning data from users of posts, which in my opinion, is a very different thing from what I’m trying to do.

I just want to display different information about the location based on the choice the user made.

For example:

Location 1 = 3396 Church Street, Queens, NY 11423
Location 2 = 1965 Lawman Avenue, Chantilly, VA 22021
Location 3 = 2618 Locust Street, Nashville, GA 31630

Location 2 gets selected – now the user should see the data of Location 2 in 3 fields.

How do I accomplish this?

I hope you can help me. Thanks in advance.

Best regards

• John Huebner

• February 9, 2018 at 11:41 pm

Hello @wbjkr and welcome to ACF.

I have published several examples other than the one you mention. https://github.com/Hube2/acf-dynamic-ajax-select-example. While there is nothing exactly like what you’re looking for, what you want combines what is in the select example https://github.com/Hube2/acf-dynamic-ajax-select-example/tree/master/dynamic-select-example and the relationship example https://github.com/Hube2/acf-dynamic-ajax-select-example/tree/master/dynamic-fields-on-relationship.

The only real difference from any of the examples will be in the PHP function that runs on the ajax request. In this case you’ll be getting values from the options page to return.

I don’t have time at the moment to put any code together for this.

• wbjkr

• February 12, 2018 at 7:40 pm

Hello @hube2, thank you for some direction.

Unfortunately, I’m not that experienced at using PHP – could anyone show me how it’s done?

In the meantime, I’m trying to get it to work by trial and error.

Thanks in advance.

• csaborio

• September 16, 2019 at 11:25 pm

@hube2 : Just got a proof of concept working based on the code from those repos. Thanks a lot for making that code available, that’s the only reference I have seen for dynamically loading ACF values based on the choice of another value.