JavaScript in a PHP plugin

Question

I am writing a plugin (in PHP) that outputs an array.

The resulting array should be the input for some JavaScript file that outputs a chart (.png image) based on the array.

With this in mind, I should pass variables to JavaScript from the PHP plugin (as seen here).

I wonder if the process with a plugin is different from an ordinary PHP file...

The JS chart should be displayed according to user action.

---

In a nutshell:

How can I call the JS file, pass a variable to it via an ordinary plugin?

Answer 1

So the question and answer you linked to is still valid, the only part that changes is the AJAX part.

Specifically, there are now 2 options:

• Admin AJAX API: A legacy API, most tutorials will use this, but it's much harder to secure, and provides little to no help. If it isn't implemented right you will have no clues as to why it isn't working
• REST API endpoints: These return JSON, and have significantly more support and helping structures. You can define the parameters you expect in a request and it'll tell you if you didn't include them, etc This is much easier and newer

e.g. lets add an endpoint:

add_action( 'rest_api_init', function () {
        register_rest_route( 'tomjn/v1', '/test/', array(
                'methods' => 'GET',
                'callback' => 'tomjn_rest_test'
        ) );
} );

This says, when a GET request is made to /wp-json/tomjn/v1/test call the function tomjn_rest_test to get the result:

function tomjn_rest_test( $request ) {
        return "moomins";
}

Which we can then fetch in javascript, here's a jQuery example:

<script>
jQuery.ajax({
    url: <?php echo wp_json_encode( esc_url_raw( rest_url( 'tomjn/v1/test' ) ) ); ?>
}).done(function( data ) {
    jQuery( '#tomsword' ).text( data );
});
</script>