0

I am testing ajax in wordpress, and it basically works but I do not want the url to be hardcoded, so I tried using wp_localize_script to get an object to use, but I get an error saying: "ReferenceError: WPURLS is not defined" when alerting the siteurl in ajax_script.js.

functions.php

function my_scripts_method() {
    wp_enqueue_script(
        'ajax_script',
        get_stylesheet_directory_uri() . '/js/ajax_script.js',
        array( 'jquery' )
    );
}
add_action( 'wp_enqueue_scripts', 'my_scripts_method' );

wp_localize_script('ajax_script', 'WPURLS', array( 'siteurl' => get_option('siteurl') ));

ajax_script.js

$(function () {

    $('#vru-btn').click(function() {
        // alert('code');
        $.post( 'wp-content/themes/wpcleantheme/ajax/test.php', function(data) {
            $('#vru-div').html(data);    
        });
    });;

    alert(WPURLS.siteurl);
});
2
  • You are adding siteurl but trying to access template_url. :)
    – Rarst
    Feb 9, 2014 at 18:14
  • I was testing two methods so it got mixed up, but that's not the problem. I changed it (as it was before), but the issue is it not recognizing WPURLS object. Feb 9, 2014 at 18:20

2 Answers 2

2

You're calling wp_localize_script before the action that enqueues the script has run. Move the localize into the enqueue action, after the script is enqueued.

function my_scripts_method() {
    wp_enqueue_script(
        'ajax_script',
        get_stylesheet_directory_uri() . '/js/ajax_script.js',
        array( 'jquery' )
    );
    wp_localize_script('ajax_script', 'WPURLS', array( 'siteurl' => get_option('siteurl') ));
}
add_action( 'wp_enqueue_scripts', 'my_scripts_method' );

That said, you probably don't want to be directing requests directly to template files, as you won't have access to any of the WordPress API that way. Instead, direct requests to admin_url('admin-ajax.php'), and read up on using AJAX in Plugins.

2
  • Thanks. I will more likely be using it in plugins, this is just for testing. I included 'wp-load.php' in my theme file so as to have access to the WP API, do you think this is a bad idea? Feb 9, 2014 at 18:51
  • depends on the context. it's probably ok for your own purposes, but bad if you will distribute this code. wp-load.php isn't necessarily in the same place on all installs, so it's prone to failure. WordPress.org plugin repository will reject any plugin that does that.
    – Milo
    Feb 10, 2014 at 19:39
0

Register the script, then localize it, then enqueue it. According to WordPress Codex

 // Register the script
 wp_register_script( 'some_handle', 'path/to/myscript.js' );

 // Localize the script with new data
 $translation_array = array(
'some_string' => __( 'Some string to translate', 'plugin-domain' ),
'a_value' => '10'
 );
 wp_localize_script( 'some_handle', 'object_name', $translation_array );

 // Enqueued script with localized data.
 wp_enqueue_script( 'some_handle' );
1
  • this way you can add dependent scripts and only run the enqueue once, but both solutions will work. Mar 18, 2017 at 1:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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