Cómo pasar una variable a la acción wp_ajax en WordPress

Question

Cómo pasar una variable a la acción wp_ajax en WordPress

14 abr 2015, 21:54:46

Vistas: 15.7K

Votos: 3

Estoy escribiendo un plugin que obtiene datos de una API externa y los inserta en un tema de bbPress. Aquí hay un código de ejemplo:

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' );

    // Código jQuery AJAX, acciones 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' );

    // Luego obtengo los datos con cURL y los muestro. Pero necesito $the_issue_key para completar la autenticación API
}

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

No puedo entender cómo pasar $the_issue_key a la función get_ajax_content. Intenté establecerla como global (horror) pero siempre devuelve null.

$the_issue_key = get_post_meta( $topic_id, 'bbp_jira_issue_field', true); ejecutado en la función get_ajax_content devuelve null.

¿Hay algo específico sobre la acción wp_ajax que deba saber - o me estoy perdiendo algo obvio?

Finne

33

plugins php ajax bbpress

Todas las respuestas a la pregunta

Comentarios

Casi llegamos, muchas gracias :) ¿Podrías aclararme una cosa? En la función de callback, digamos que $the_issue_key = "12345" - tengo problemas para entender cómo pasar esto al array youruniquejs_vars & siempre devuelve null.

Finne

15 abr 2015 17:50:28

Necesitas aplicar el valor "12345" cuando hacemos el "wp_localize_script"

    `wp_localize_script( 'your_unique_js_name', 'youruniquejs_vars', array('ajaxurl' => admin_url( 'admin-ajax.php' ),'the_issue_key' => "12345",) );`

(Perdón por el formato aquí... no logro que se vea "bonito")

Phil Johnston

15 abr 2015 17:56:07

Phil Johnston 131 · Accepted Answer · 2015-04-14T22:23:16Z

Necesitarías colocar el valor de la variable en la página para que JavaScript pueda pasarlo de vuelta a PHP usando AJAX. Las funciones AJAX son una "carga de página" completamente separada, así que incluso si la hicieras global no funcionaría. La mejor manera de hacer esto es usando "wp_localize_script" (https://codex.wordpress.org/Function_Reference/wp_localize_script)

Aquí tienes un ejemplo completo de cómo podrías hacerlo:

// Primero encola tu JavaScript en WordPress
    function your_prefix_enqueue_scripts(){

        //Encuela tu JavaScript (esto asume que tu archivo JavaScript está ubicado en tu plugin en un directorio "includes/js")
        wp_enqueue_script( 'your_unique_js_name', plugins_url('js/yourjavascriptfile.js', dirname(__FILE__) ), array( 'jquery' ) );

        //O (más simple pero no recomendado)
        wp_enqueue_script( 'your_unique_js_name', 'http://domain.com/myjavascriptfile.js', array( 'jquery' ) );

        //Aquí creamos una variable objeto de JavaScript llamada "youruniquejs_vars". Podemos acceder a cualquier variable en el array usando youruniquejs_vars.nombre_de_sub_variable
        wp_localize_script( 'your_unique_js_name', 'youruniquejs_vars', 
            array(
                //Para usar esta variable en JavaScript usa "youruniquejs_vars.ajaxurl"
                'ajaxurl' => admin_url( 'admin-ajax.php' ),
                //Para usar esta variable en JavaScript usa "youruniquejs_vars.the_issue_key"
                'the_issue_key' => $the_issue_key,

            ) 
        );  

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

    //Esta es tu función de callback para AJAX
    function your_ajax_callback_function_name(){

        //Obtiene los datos del post
        $the_issue_key = $_POST["the_issue_key"];

        //Haz lo que necesites aquí

        //Crea el array que enviaremos de vuelta a JavaScript
        $array_we_send_back = array( 'test' => "Test" );

        //Asegúrate de codificar la salida en json porque eso es lo que espera
        echo json_encode( $array_we_send_back );

        //Asegúrate de terminar (die) cuando hayas terminado de enviar la salida AJAX.
        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' );

Y luego en tu archivo JavaScript haz algo como esto:

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

    /**
     * Cuando se hace clic en tu disparador AJAX
     *
     */
    $( document ).on( 'click', '.my-button', function(event){

        event.preventDefault();

        // Usa AJAX para hacer algo...
        var postData = {
            action: 'your_ajax_callback_function_name',
            the_issue_key: youruniquejs_vars.the_issue_ke,
        }

        //AJAX para cargar más posts
        $.ajax({
            type: "POST",
            data: postData,
            dataType:"json",
            url: youruniquejs_vars.ajaxurl,
            //Se ejecuta cuando AJAX 'regresa' y es un json válido
            success: function (response) {

                alert( response.test );

            }
            //Se ejecuta cuando AJAX 'regresa' y no es un json válido
        }).fail(function (data) {
            console.log(data);
        }); 

    });

});