Having a flexible content with repeater that have few fields like title and wysiwyg.
Now this content, I need to have # -links to each of the looped content blocks.
If I use text input and rand with php, it is the same rand with all of the repeated fields -> does not work.
If I use the cleaned title field, all of the links will break if someone changes the title
If I use the loop index, it will break the link if the order of blocks is being changed.
So how could I make permanent slug for each of the repeated fields that does not change and that is something the content-editor user does not need to type ?
I do this in Javascript.
The first thing that I do is to create a text field and then add https://www.advancedcustomfields.com/resources/acf-prepare_field/ to make the field readonly.
(function($){
if (typeof acf != 'undefined') {
acf.add_action('ready append', function($el) {
// generate ID values
var ids = [];
// use the field key of your text sub field
var fields = $('[data-key="field_5dd6ea9c6325c"] .acf-input input').not('.clones [data-key="field_5dd6ea9c6325c"] .acf-input input');
if (fields.length) {
var prefix = 'pnl-';
// I also have my scripts localized with this object
// it contains the post ID
// so that I am sure the ID is unique on every post
if (typeof(theme_admin_values['post']['id']) != 'undefined') {
prefix += theme_admin_values['post']['id']+'-';
}
for (i=0; i<fields.length; i++) {
var field = $(fields[i]);
var value = field.val();
if (value == '' || panel_ids.indexOf(value) != -1) {
value = prefix+acf.uniqid();
field.val(value);
field.trigger('change');
}
panel_ids.push(value);
}
}
// end generate ID values
}); // end acf.add_action
} // end if acf definded
})(jQuery);
I do this for several fields, each has it’s own prefix. No, they are not pretty ID values, but I know they are not going to change. This script is a little slow because every field is checked every time a new row is added. I haven’t worked out how to only work on new rows without looking at the existing ones.
