0

I believe I have properly enqueue'ed and localized my script - I've got $q showing up in the DOM. Now I'm sure I'm missing the simple last step to accessing a variable in the JS function.

Here's my PHP:

add_action( 'wp_enqueue_scripts', 'sdm_load_javascript_files' );
function sdm_load_javascript_files() {

  wp_register_script( 'showMake', get_template_directory_uri() . '/js/functions.js', array('jquery'), '1.1.0', true );

  wp_enqueue_script( 'showMake', get_template_directory_uri().'/js/functions.js', array( 'jquery' ) );
  $inventory_makes = get_inventory_makes();
  wp_localize_script(  'showMake', 'q', $inventory_makes );

}


function get_inventory_makes() {
  global $wpdb;
  $inventory_makes = $wpdb->get_results
    ("
      SELECT COUNT(inventory_id) as count_car, inventory_make
      FROM wp_dsfbjd_wpinventory_item
      GROUP BY inventory_make
    ");
  return $inventory_makes;
}

And here's part of my template where I think I'm missing what I need:

<ul>
  <?php
    $inventory_makes = get_inventory_makes();
    foreach ( $inventory_makes as $make )
    {            echo '<li><a onclick="showMake(q.inventory_make)">',$make->inventory_make,'&nbsp;(',$make->count_car,')','</a></li>';
    }
  ?>
</ul>

And lastly, my js function:

function showMake() {

  console.log(q.inventory_make);

}

And the DOM: *

When I click on the HTML element, my console logs 'undefined' - after I've got access to the q.inventory_make I'll refresh the list of cars to show the make clicked.

Thanks in advance for pointing me in the right direction.

  • what does the structure of q look like in the DOM? You iterate over it with foreach in PHP, accessing inventory_make as a member of each $make object, but then in JS you try to access inventory_make as if it's a direct child of q. – Milo Jun 6 '16 at 2:02
  • Thanks, Milo. That's exactly what it is. There's an extra layer. I'm a JS rookie - is it q.object.inventory_make? – Nick M Jun 6 '16 at 2:44
  • I added a screenshot above. Happy to do some learning if you've got a link to point me in the right direction as well. – Nick M Jun 6 '16 at 3:00
1

You have wp_enqueue_script( 'showMake' ); twice. Remove the last line from your sdm_load_javascript_files function and see if it works.

  • Thanks for the reply. I removed it and it is still showing 'undefined' in the console when I click on the make. – Nick M Jun 5 '16 at 23:14

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.