Reply To: Populate repeater rows with JS API

• brnteka

• May 7, 2022 at 3:06 pm

so after some time digging into the source code i ended up with this code, maybe it would be helpful for somebody who stumbles upon similar functionality

jQuery(document).ready(function ($) {
    if (typeof acf == 'undefined') {
        return;
    }

    var scheduleTemplate = acf.getField('schedule_template_weeks');

    acf.addAction("new_field/key=field_617d3317cd216", function ($field) {
        scheduleTemplate.$rows().each(function (index, element) {

            var dayOfWeekNewField = $field.add()
            var days = acf.getField(dayOfWeekNewField.find('[data-key="field_617d2f19b30e3"]'));
            var timeslots = acf.getField(dayOfWeekNewField.find('[data-key="field_617d33d4d109c"]'));
            var daysTemplate = acf.getField($(element).find('[data-key="schedule_template_weeks_days"]'));
            var timeslotsTemplate = acf.getField($(element).find('[data-key="schedule_template_weeks_timeslots"]'));

            //days

            days.$inputs().each(function (index, element) {
                if (daysTemplate.getValue().includes('on')) {
                    days.$toggle().click()
                } else if (daysTemplate.getValue().includes($(element).val())) {
                    element.checked = true;
                }
            })

            timeslotsTemplate.$rows().each(function (index, element) {

                var timeSlotNewField = timeslots.add()

                var from = acf.getField(timeSlotNewField.find('[data-key="field_617d3195ab484"]'));
                var to = acf.getField(timeSlotNewField.find('[data-key="field_617d3201e9780"]'));
                var price = acf.getField(timeSlotNewField.find('[data-key="field_617d3207e9781"]'));
                var type = acf.getField(timeSlotNewField.find('[data-key="field_617d3226e9782"]'));

                var fromTemplate = acf.getField($(element).find('[data-key="schedule_template_weeks_timeslot_time_from"]'));
                var toTemplate = acf.getField($(element).find('[data-key="schedule_template_weeks_timeslot_time_to"]'));
                var priceTemplate = acf.getField($(element).find('[data-key="schedule_template_weeks_timeslot_price"]'));
                var typeTemplate = acf.getField($(element).find('[data-key="schedule_template_weeks_timeslot_type"]'));

                //from

                from.$input().val(fromTemplate.getValue())

                var parsedFromTime = $.datepicker.parseTime('HH:mm:ss', fromTemplate.getValue(), {})

                var formattedFromTime = $.datepicker.formatTime('h:mm tt', {
                    hour: parsedFromTime.hour,
                    minute: parsedFromTime.minute
                }, {})

                from.$inputText().val(formattedFromTime)

                //to

                to.$input().val(fromTemplate.getValue())

                var parsedToTime = $.datepicker.parseTime('HH:mm:ss', toTemplate.getValue(), {})

                var formattedToTime = $.datepicker.formatTime('h:mm tt', {
                    hour: parsedToTime.hour,
                    minute: parsedToTime.minute
                }, {})

                to.$inputText().val(formattedToTime)

                //price

                price.$input().val(priceTemplate.getValue())

                //type
                type.$el.find('[value=' + typeTemplate.$input().val() + ']').click();
            })
        })
    });
});