I know there’s already some threads about this topic, but some are really old and I’m not going anywhere with the others.
I’ve created an options page with acf_add_options_page. One of the options is a repeater with two fields: Product and Sub-Product. To make things easy I’ve set the Product field as a text field and the Sub-Product field as a text area, with comma separated values. Each product is supposed to have multiple sub-products, like this:
Product A – Sub-Product 1, Sub-Product 2, Sub-Product 3
Product B – Sub-Product 4, Sub-Product 5, Sub-Product 6
Product C – Sub-Product 7, Sub-Product 8, Sub-Product 9
And so on…
In the frontend I have two dropdowns (select fields), one for Product and another one for Sub-Product.
The goal is, when the user picks Product-A from the first dropdown, the values in the second dropdown will be read from the repeater field (the text area with the comma separated values).
I’m loading the values in the first dropdown with acf/load_field/name=product. So far so good.
Then, with jQuery I can load the comma separated values to the second dropdown. The problem is, when I save the post, it will save the selected value in the first dropdown but not in the second.
I read somewhere that the values must be loaded with AJAX. I spent a long time trying to figure out how to work with AJAX, only to find out that it would do almost the same as jQuery and it won’t save the values as well.
Most probably, I’m doing something wrong with AJAX.
Anyone can point me in the right direction? Maybe this is not related to AJAX at all. I’m running out of ideas. Please help!