Customiser `active_callback` not working on control with `postMessage` transport method

Because postMessage uses JavaScript entirely, any PHP active_callback will not get called unless the preview refreshes (e.g. via wp.customize.previewer.refresh()). So what you need to do is implement the active callback in JavaScript instead, like so:

wp.customize.bind( 'ready', function () {
    wp.customize.control( 'archive_show_more_link', function( control ) {
        var setting = wp.customize( 'archive_link_tile_size' );
        control.active.set( 'large' === setting.get() );
        setting.bind( function( value ) {
            control.active.set( 'large' === value );
        } );
    } );

    wp.customize.control( 'search_show_more_link', function( control ) {
        var setting = wp.customize( 'search_link_tile_size' );
        control.active.set( 'large' === setting.get() );
        setting.bind( function( value ) {
            control.active.set( 'large' === value );
        } );
    } );
} );

Make sure that this script gets enqueued into the Customizer pane and not the Customizer preview. In other words, enqueue the JS at the customize_controls_enqueue_scripts action.

Leave a Comment