Prepopulate Custom Fields Based off of Taxonomy

• johnstew

• May 24, 2016 at 11:27 am

Alright so I have a repeater set up that contains an image field, text field, and textarea field. I want to have a select field above this that allows for the user to pick a taxonomy term and then I want to create 4 repeater items based off of that selection allowing the user to either submit the 4 generated repeater items or edit any one of the generated repeater items.

Is this functionality possible or does it require me building a custom field of some sort?

Thanks!

• James

• May 24, 2016 at 3:42 pm

Hi @johnstew

I’m afraid you need to create a custom Javascript code to do it. The problem is that repeater field has a complex layout that makes it hard to modify. For something like that you would need to hire a developer to help you out with it, and I’d recommend looking for one on https://studio.envato.com/ or https://www.upwork.com/. You can also check this page to learn how to add custom Javascript code: https://www.advancedcustomfields.com/resources/adding-custom-javascript-fields/.

I think it will be easier if you don’t need to show the generated items right away. That means that you need to update/save the post, which reloads the editor page, to show the items. To do that, you can use the acf/save_post hook and the update_field() function to update the repeater value.

I hope this makes sense 🙂

• johnstew

• May 25, 2016 at 1:47 am

Hi James,

Thanks for getting back to me!

So writing custom Javascript is something I’m definitely comfortable with doing the only issue that I have with that approach is I don’t like the idea of generating that HTML within JS and then injecting it onto the page. In my mind this is what would have to happen if I went the JS way.

– User selects Taxonomy term from Select
– I make AJAX call to PHP with the Taxonomy Term.
– PHP makes call to DB to get latest 4 entities that have that Taxonomy Term and send back.
– Consume response from PHP and create HTML in JS and render HTML onto the page.

The last step is a problem because from what I can see in the HTML on the admin page there is a lot of dynamic ids and attributes that are used that I wouldn’t have on my HTML because I have no way of knowing whats needed. Maybe you have some more insight there that I’m missing.

If I go the second route you suggested that seems a little more doable. My only question there is on the save_post hook I would need to make a call to DB to get the latest 4 entities and then create fields not update fields. Not sure if I can make a call to DB in that hook and also not sure if update_fields() is what I need. So I took a look into the docs more and saw add_row(). Do you think this would be better for what I’m trying to do?

Thanks!

• James

• May 25, 2016 at 1:13 pm

Hi @johnstew

As I said before, modifying it using JS would be a complex thing to do. This is what I have in my mind (and tested it in the console):

1. Target the add row button and execute the .click() function.
jQuery(".acf-field-1234567890abc .button-primary").click()

2. Search the last generated row that has data-id that is not equal as “acfcloneindex”.
jQuery(".acf-field-1234567890abc .acf-row[data-id!='acfcloneindex']:last input[id$='field_abc1234567890']").val("test")

“field_1234567890abc” is the key of my repeater while “field_abc1234567890” is the key of the subfield.

Regarding the second method, yes, you can get the latest four entities in that hook. It should be the same as the one in your PHP code.

The add_row() function will only work if the reference key exists in the database. It means that you have to save the post from the backend. If you use the update_field() function, you can pass the field key instead of the field name to create the reference key in the database. But I guess it doesn’t matter as you do it on the backend anyway. It may be odd, but the update_field() function can be used to create a new custom field entries too.

I hope this makes sense 🙂