Is it posible to change a gutenberg block with data from acf metaboxes?
I made a block that shows/hides elements through settings in the page metaboxes acf. Only that block doesnt update live after changing the settings. Also after save i need to refresh the page to show the change.
Is it posible to let ACF metabox trigger update gutenberg block?
It is like block bindings api but without the binding..
Just need to fire a update because my block gets its data from get_field(‘meta’,$postID);
Oke getting pretty close to a solution but can’t figure out how to trigger “rerender” on the acf block.
(function($, acf, wp){
const blockName = 'tatof/content-side';
const fieldKey = 'field_1234567890abc';
acf.addAction('ready', () => {
const field = acf.getField(fieldKey);
if (! field) return;
field.on('change', 'input, select, textarea, checkbox', () => {
const newVal = field.val();
// Push into WP data store
wp.data.dispatch('core/editor').editPost({
meta: { event_date: newVal }
});
// Update the block attribute
const { getBlocks } = wp.data.select('core/block-editor');
const { updateBlockAttributes } = wp.data.dispatch('core/block-editor');
getBlocks().forEach(block => {
if (block.name !== blockName) return;
updateBlockAttributes(block.clientId, { googleRev: newVal });
// Force ACF to re-render preview
const wrapper = document.querySelector('.wp-block[data-type="'+blockName+'"][data-block="'+block.clientId+'"]');
if (wrapper) {
acf.doAction(
'render_block_preview',
$(wrapper),
{
name: blockName,
attributes: block.attributes,
mode: 'preview'
}
);
}
});
});
});
})(jQuery, acf, wp.data);
oke i give up. Even tried to do it the @wordpress way with edit.js etc.
Should be a simple thing but it looks imposible..
i want to reload an ACF block when i change an ACF metabox checkbox
You must be logged in to reply to this topic.
Welcome to the Advanced Custom Fields community forum.
Browse through ideas, snippets of code, questions and answers between fellow ACF users
Helping others is a great way to earn karma, gain badges and help ACF development!
We use cookies to offer you a better browsing experience, analyze site traffic and personalize content. Read about how we use cookies and how you can control them in our Privacy Policy. If you continue to use this site, you consent to our use of cookies.