Home Forums Gutenberg Run JS when Block is Opened?


Run JS when Block is Opened?

  • I have the following block…

                'name'              => 'columns',
                'title'             => __('Columns'),
                'description'       => __('For complex multi colomn rows.'),
                'render_template'   => get_template_directory() . '/includes/blocks/templates/columns.php',
                'enqueue_style'     => get_template_directory_uri() . '/includes/blocks/css/columns.css',
                'enqueue_script'    => get_template_directory_uri() . '/includes/blocks/js/columns.js',
                'mode' => 'auto',

    I need to run some JS when this block is being opened. For example, when I save it and come back and click on the block to open it for editting again. My first thought was to just run a click function but it isn’t working and I don’t know why. Below is my JS which I formed from the docs. My other JS works (not copied here) but this one click function wont fire.

    (function ($) {
        var initializeBlock = function ($block) {
            $('body').on('click', 'div[data-type="acf/columns"]', function () {
        if (window.acf) {
            window.acf.addAction('render_block_preview/type=columns', initializeBlock);
Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

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 Cookie Policy. If you continue to use this site, you consent to our use of cookies.