Run JS when Block is Opened?

• jeathree

• June 4, 2019 at 3:10 am

I have the following block…

        acf_register_block_type(array(
            '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 () {
            console.log('teeeeeeeest');
        });        
    }

    if (window.acf) {
        window.acf.addAction('render_block_preview/type=columns', initializeBlock);
    }

})(jQuery);

• oxy

• August 30, 2019 at 12:23 am

This is currently broken and render_block_preview only runs during the initial render.

There’s a “hidden” action you can subscribe to for remounts.

window.acf.addAction('remount', function ($el) {});