3

I'm writing a plugin that pulls data from an external API and inserts it into a bbPress topic. Here's some sample code:

function bbp_ajax() {
    $topic_id = bbp_get_topic_id();
    $the_issue_key = get_post_meta( $topic_id, 'bbp_jira_issue_field', true);
    $nonce = wp_create_nonce( 'theNonce' );

    // jQuery AJAX Code, actions bbpAjax...
}
add_action ( 'bbp_template_before_replies_loop', 'bbp_ajax');

function get_ajax_content() {
    check_ajax_referer( "theNonce" );
    $api_url = get_option( 'jifbs_url' );
    $fullurl = $api_url.$the_issue_key;

    $username = get_option( 'jifbs_username' );

    // Then I pull in the data with cURL and echo it. But I need $the_issue_key to complete the API auth
}

add_action( 'wp_ajax_bbpAjax', 'get_ajax_content' );
add_action( 'wp_ajax_nopriv_bbpAjax', 'get_ajax_content' );

I can't figure out how to pass $the_issue_key into the get_ajax_content function. I've tried setting it as a global (shudder) but it always returns null.

$the_issue_key = get_post_meta( $topic_id, 'bbp_jira_issue_field', true); run in the get_ajax_content function returns null.

Is there something specific to a wp_ajax action that I might need to know - or am I missing something really obvious?

6

You'd need to put the variable's value onto the page so that javascript can pass it back to PHP using ajax. Ajax functions are a completely separate "page load" so even if you made it global it won't work. The best way to do this is using "wp_localize_script" (https://codex.wordpress.org/Function_Reference/wp_localize_script)

Here's an full example of how you could do it:

//First enqueue your javascript in WordPress
    function your_prefix_enqueue_scripts(){

        //Enqueue your Javascript (this assumes your javascript file is located in your plugin in an "includes/js" directory)
        wp_enqueue_script( 'your_unique_js_name', plugins_url('js/yourjavascriptfile.js', dirname(__FILE__) ), array( 'jquery' ) );

        //OR (simpler but not recommended)  
        wp_enqueue_script( 'your_unique_js_name', 'http://domain.com/myjavascriptfile.js', array( 'jquery' ) );

        //Here we create a javascript object variable called "youruniquejs_vars". We can access any variable in the array using youruniquejs_vars.name_of_sub_variable
        wp_localize_script( 'your_unique_js_name', 'youruniquejs_vars', 
            array(
                //To use this variable in javascript use "youruniquejs_vars.ajaxurl"
                'ajaxurl' => admin_url( 'admin-ajax.php' ),
                //To use this variable in javascript use "youruniquejs_vars.the_issue_key"
                'the_issue_key' => $the_issue_key,

            ) 
        );  

    }
    add_action( 'wp_enqueue_scripts', 'your_prefix_enqueue_scripts' );

    //This is your Ajax callback function
    function your_ajax_callback_function_name(){

        //Get the post data 
        $the_issue_key = $_POST["the_issue_key"];

        //Do your stuff here

        //Create the array we send back to javascript here
        $array_we_send_back = array( 'test' => "Test" );

        //Make sure to json encode the output because that's what it is expecting
        echo json_encode( $array_we_send_back );

        //Make sure you die when finished doing ajax output.
        die(); 

    }
    add_action( 'wp_ajax_' . 'your_ajax_callback_function_name', 'your_ajax_callback_function_name' );
    add_action( 'wp_ajax_nopriv_' . 'your_ajax_callback_function_name', 'your_ajax_callback_function_name' );

And then in your javascript file do something like this:

jQuery(document).ready(function($){

    /**
     * When your ajax trigger is clicked
     *
     */
    $( document ).on( 'click', '.my-button', function(event){

        event.preventDefault();

        // Use ajax to do something...
        var postData = {
            action: 'your_ajax_callback_function_name',
            the_issue_key: youruniquejs_vars.the_issue_ke,
        }

        //Ajax load more posts
        $.ajax({
            type: "POST",
            data: postData,
            dataType:"json",
            url: youruniquejs_vars.ajaxurl,
            //This fires when the ajax 'comes back' and it is valid json
            success: function (response) {

                alert( response.test );

            }
            //This fires when the ajax 'comes back' and it isn't valid json
        }).fail(function (data) {
            console.log(data);
        }); 

    });

});
| improve this answer | |
  • Almost there, thanks very much :) Can you clarify one thing for me though? In the callback function, lets say $the_issue_key = "12345" - I'm struggling with how to pass this to the youruniquejs_vars array & it always returns null. – Finne Apr 15 '15 at 14:50
  • You need to apply the value "12345" when we do the "wp_localize_script" wp_localize_script( 'your_unique_js_name', 'youruniquejs_vars', array('ajaxurl' => admin_url( 'admin-ajax.php' ),'the_issue_key' => "12345",) ); (Sorry about the formatting here...can't seem to make it "look nice") – Phil Johnston Apr 15 '15 at 14:56

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.