Automatically create and prepopulate some repeater fields

• princeofabyss

• August 26, 2023 at 7:06 pm

I’m using ACF to create a tuition planner. The fields will include a Total tuition fee field, a Deposit field, and a Number of installments field (a drop-down with values from 2 to 12). And finally a repeater field with fields: Installment amount, Due Date, Paid (a checkbox), and Date of payment.

Ideally, what I’d like is a way to create and pre-populate the Installment amount fields of the repeater as soon as the admin selects the number of installments from the drop-down (if, of course, the Total tuition fee field and Deposit field are already filled in.

Of course, you understand the logic, that the JS invlolved will subtract the deposit from the total, then divide it by the number of installments, and that amount will pre-populate the Installment amount of the repeater rows (the rows will be, of course, the same number as the Number of Installments selected in the drop-down.

I’m not interested in the JS part that will “listen” to the change event of the Number of installments drop-down… Nor the arithmetic calculations of the amount of the installment – that’s the easy part…

I’m interested in a way to dynamically create the repeater rows. I assume it will have to be something that will trigger the methods involved when the Add row button is pressed, but I’ve never done it before, so I thought to ask here before I dig into the code to find out the hard way how it’s done by ACF.

Any help will be very much appreciated. TIA.

• John Huebner

• November 17, 2023 at 12:49 pm

The only way that I’ve found to dynamically add repeater rows is to first target the click action in ACF that triggers it. This may be possible with the new JS API, but I’ve never tried it and I don’t know of any examples.

$('selector to target click').trigger('click');

You do this as many times as you want rows. After this is done you loop over the new rows in the repeater to add values to the sub field.

This is an old example I created IT DOES NOT WORK because it was based on an older version of ACF. But in it there is an example or how to create and populate repeater rows.