
Hi all,
I want to know if the below scenario can be achieved.
I have 2 select fields, that gets the dropdown dynamically. This is inside a repeater field block.
1. First select field makes an api call and gets response and fills the dropdown. I will select an option in the dropdown.
2. Based on the option selected in the First dropdown, I will make an api call by passing the selected dropdown value and get the response. This response will fill the dropdown.
3. The second dropdown is a repeatable field too. I need to limit the repeated field to the number of keys present in the json response of the second dropdown. eg: If second dropdown has 4 options, I can repeat this field 4 times.
Eg: 1. When options page loads, I make an api call and fill in the first dropdown. Say Apple, Samsung, Windows, Xiaomi (This remains same even when I repeat the section).
2. Say I select Apple, I make api call by passing ‘apple’ as a parameter and I get back 5 phones. 5, 5c, 5s, 6, 6s
3. Now this 2nd dropdown where I select iPhones will be repeatable 5 times as I got back 5 keys.
Is there a way I can achieve this. Please guid me though some examples and what ACF fields to use and how to proceed with ajax calls when selecting etc., would be helpful.
Not sure if this will help you or not. I have an example here that creates repeater rows based on the response from a ajax request https://github.com/Hube2/acf-dynamic-ajax-select-example/tree/master/dynamic-repeater-on-category. There are also several other examples in the same repo that do ajax requests to dynamically populate other fields. I don’t have any examples the exactly fit what you’re looking for but I think that many of the things you’re looking for are represented.