Reply To: Put styles to file with unique ID

• John Huebner

• June 20, 2019 at 2:31 am

Because you are using a flex field I would create a sub field in every layout to hold the ID. I would either make this field readonly or I would completely hide it in the admin. I would use JS to generate a unique.

I’ve done this in the past and I used a clone field for my layout settings. This is a snippet of code from that

if (typeof acf != 'undefined') {
	acf.add_action('append', function($el) {
		// this will run when a new layout is added
		
		// generate a tab ID value
		$el.find('[data-key="field_580a29b44f676"] input').each(function(index, element) {
			if (element.value == '') {
				var new_id = acf.get_uniqid('tab-');
				element.value = new_id;
			}
		});
		
		// generate a container ID value
		$el.find('[data-key="field_580f79274e327"] input').each(function(index, element) {
			if (element.value == '') {
				var new_id = acf.get_uniqid('container-');
				element.value = new_id;
			}
		});
		
		// generate column ID field_5812172eb48c4
		$el.find('[data-key="field_5812172eb48c4"] input').each(function(index, element) {
			if (element.value == '') {
				var new_id = acf.get_uniqid('column-');
				element.value = new_id;
			}
		});
	
	
	}); // end acf.add_action
}

The field is a readonly txt field and the I output these ID values where they are needed in the html.