Question 14475 in Wordpress Question posted in
The official Wordpress documentation can be found here.

Passing a variable from php to javascript on button click – WordPress

Hi I am trying to pass a variable on button click from a php function to javascript. The output is undefined for some reason but at the php function the variable does contain data. Any idea why this is happening?

PHP:

    add_filter( 'page_row_actions', 'create_pdf_row_actions', 10, 2 );
function create_pdf_row_actions( $actions, WP_Post $post ) {
    if ( $post->post_type != 'item' ) {
        return $actions;
    }

   # $actions['create-pdf'] = "<a href='#?id=".$post->ID."'  >Create PDF</a>";
    $actions['create-pdf'] = "<a href='#?id=".$post->ID."'  >Create PDF".$post->ID."</a>";
    return $actions;
}

Javascript:

  jQuery(document).ready(function($){
    $('.create-pdf').on('click', function () {
        alert("button"+ $(this).data("id"));
    }); 
  });
Tags:

2

Answers


  1. 0

    Assuming from the piece of code,
    You can try:

    Calling the PHP function within jQuery by using the <?php ?> tags. Since $actions['create-pdf'] is inside an array, use print_r to output the variable, or use foreach loop if you have multipile key-value pairs

    Login or Signup to reply.
  2. 0

    jQuery’s .data() accesses an element’s dataset but the id in your link appears to be in the URL fragment of the href attribute.

    You have two options…

    1. Add the appropriate data-id attribute to your link

      $actions['create-pdf'] = sprintf(
    '<a href="#?id=%1$s" data-id="%1$s">Create PDF%1$s</a>',
    htmlspecialchars($post->ID)
);

      $(".create-pdf").on("click", "a[data-id]", function(e) {
  e.preventDefault();
  alert(`button${$(this).data("id")}`);
});

    2. Or, extract the id from the params in the URL fragment

      $(".create-pdf").on("click", "a[href]", function(e) {
  e.preventDefault();
  const url = new URL(this.href);
  const params = new URLSearchParams(url.hash.slice(1));
  alert(`button${params.get("id")}`);
});
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search