3

I have a contact form in a WordPress page like this:

$( '#contact_form' ).bootstrapValidator({
    fields: {
        // ...
    },
    submitHandler: function( formInstance ) {
        $.post( "../send-message", $("#contact_form").serialize(), function( result ) { 
            alert( pw_script_vars.State );            
        });
    }
}); 

When the form is submitted using the Ajax request it goes to another WordPress page titled /send-message that has PHP code to send an email, then it should return a success or failure value to the Ajax request to alert a success or failure message. I have tried using the wp_localize_script function in the functions.php file using a fixed value and it worked fine:

function enqueue_scripts() {
    wp_enqueue_script( 'pw_script', get_stylesheet_directory_uri().'/inc/js/functions.min.js', array( 'jquery' ) );
    wp_localize_script( 'pw_script', 'pw_script_vars', array( 'State' => 'success' ) );
}
add_action( 'wp_enqueue_scripts', 'enqueue_scripts' );

But when I tried to use the wp_localize_script in the /send-message WordPress page it failed to work. Here are the contents of the '/send-message' page :

<?php
    $sendSuccess = sendMessage();

    if( $sendSuccess )
        wp_localize_script( 'pw_script', 'pw_script_vars', array( 'State' => 'success' ) );
    else
        wp_localize_script( 'pw_script', 'pw_script_vars', array( 'State' => 'failure' ) );

    function sendMessage() {
        //This function will send the email then it will return true or false.
    }
?>

Using wp_localize_script in the /send-message causes an undefined variable pw_script_vars in the JavaScript file.

How can I use wp_localize_script in a WordPress page other than functions.php?

3
  • Is send-message a normal WP page ? What does sendMessage() function contains? How are you defining success or failure on send-message page to pass it back to AJAX handler?
    – bravokeyl
    Jul 4, 2016 at 17:32
  • $.post is a shorthand form $.ajax post , for which the third parameter is the success callback
    – bravokeyl
    Jul 4, 2016 at 17:48
  • @bravokeyl ... Yes, '/send-message' is a normal WordPress page. sendMessage() function has php code to send an email. I didn't implement it yet but it'd return success if the email is sent or failure if the email wasn't sent. It is just a PHP boolean or String variable! .. The thread you have shared is a different example; he's using a php page(sendmessage.php) and not a WordPress page.
    – Brad
    Jul 6, 2016 at 10:12

2 Answers 2

2

You cannot use wp_localize_script in page template. You have to use it in functions.php or your custom plugin, after you register your script, which is usually in the wp_enqueue_scripts action.

https://codex.wordpress.org/Function_Reference/wp_localize_script

1
  • You can hook into 'enqueue_scripts' anytime you want, also in plugins or in a custom page template. This answer is completely wrong.
    – Jebble
    Jul 5, 2016 at 12:50
0

You don't need to move your wp_localize_script anywhere else. Your problem lies within the fact that you try to use AJAX outside of WordPress. Let me refer to an earlier answer of me showing a simple version of how to use AJAX in WordPress here

Your Answer

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

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