Repeater field with many inputs

• nitruoc

• March 30, 2023 at 6:36 pm

Hello!

I’m currently stuck with an issue related to the repeater field.

My repeater contains 250 rows and each row have 12 fields.

I’ve added one more textarea field who is containing the data as JSON to speed up the load time, the save time and reduce the number of entries in the database. To achieve that I’ve used the acf/load_value hook to populate the data values from the JSON to the repeater dynamically and the acf/save_post hook for the save part.

The last improvement I’ve made to made more clear the administration screen is to collapse all rows when the DOM is loaded.

Everything is working like a charm on my computer but when I’m trying to load the page on another less powerful device (like my smartphone), the page doesn’t load totally and stays stuck.

My first throught was to use the ACF pagination on my repeater field but unfortunatly since my values are populated dynamically it doesn’t works and after many hours of searching a way to make it works it was not concluant.

There is a solution to improve the speed of load when a form contains many inputs with ACF?

Thanks in advance for your help.

• John Huebner

• April 2, 2023 at 10:36 am

Unfortunately, no.

And by adding the load_value and save_post hooks you’ve slowed it down even more because ACF will still save the values to the database and load those values from the database. Using these hooks does not override the default ACF action.

It might be possible to do this if you use acf/save_post with a priority of < 10. This would run before ACF has saved the values. You could then loop over the repeater in $_POST[‘acf’] and create your JSON and then delete the repeater input from $_POST[‘acf’], deleting the input will prevent ACF from saving the values.

It’s probably too late to make a changes but 250 rows with 12 fields in each row tells me that this should have been done with a custom post type instead of a repeater.

• nitruoc

• April 3, 2023 at 4:39 pm

Thanks John for your answer.

Sorry for the lack of information from my side.

Firstly in the hook filter acf/prepare_field, I change the field name:

add_filter( 'acf/prepare_field/name=MY_FIELD', function ( $field ) {

	$field['name'] = 'acf[' . $field['key'] . '-clone]';

	return $field;
	
}, 10, 1 );

Secondly to get the value saved in my hidden field (used to save the data as a JSON) I’m using the hook filter acf/load_value:

add_filter( 'acf/load_value/name=MY_FIELD', function ( $value, $post_id, $field ) {

	$field = acf_get_field( $field['name'] );

	$json = get_field( $field['name'] . '-json', $post_id );

	// $data proccessed here

	return $data;

}, 10, 3 );

Finally, I’m using the hook acf/save_post to update my JSON field:

add_filter( 'acf/save_post', function ( $post_id ) {

	$field_name = 'MY_FIELD';

	if ( $field_name ) {

		$field = false;

		foreach ( array_keys( $_POST['acf'] ) as $k ) {

			if ( ! str_contains( $k, '-clone' ) ) {
				continue;
			}

			$field = get_field_object( str_replace( '-clone', '', $k ), $post_id );

			if ( $field['name'] === $field_name ) {
				break;
			}

		}

		if ( $field ) {

			$data = $_POST['acf'][ $field['key'] . '-clone' ];

			update_field( $field['name'] . '-json', json_encode( $data ), $post_id );

		}

	}

}, 10, 1 );

—

To give you more context, my repeater is in a custom post type. For each post I’ve this repeater field containing a list of 250 countries. For each country I need to have 12 fields to get specific data from them for this post.