Chiamate Ajax WordPress

964 visite

Di Francesco Li Volsi | 11 Settembre 2013

In questo articolo illustreremo come effettuare Chiamate Ajax WordPress tramite l’utilizzo degli Action Hooks wp_ajax_[ajax_custom_action] e wp_ajax_nopriv_[ajax_custom_action].

I file che entrano in gioco nel nostro esempio di chiamata Ajax saranno 2 file presenti nel nostro tema di WordPress:

single.php (o page.php)
function.php

Single.php

Il nostro frontend che effettuerà la chiamata vera e propria sarà di questo tipo:

ajaxData = {
'action': 'my_custom_action',
'ID': id
};

$.ajax({
   type: "POST",
   url: '/wp-admin/admin-ajax.php',
   async: false,
   data: ajaxData,
   dataType: "json",
   success: function (msg) { 
       /*il tuo codice in caso di successo*/
   },
   failure: function (msg, ajaxOpts, thrownError) {
       /* in caso di errore */
       alert('Errore: ' + msg.status + ' ' + msg.statusText + ' ' + thrownError);
  }
});

ajaxData = {

'action': 'my_custom_action',

'ID': id

};

$.ajax({

type: "POST",

url: '/wp-admin/admin-ajax.php',

async: false,

data: ajaxData,

dataType: "json",

success: function (msg) {

/*il tuo codice in caso di successo*/

failure: function (msg, ajaxOpts, thrownError) {

/* in caso di errore */

alert('Errore: ' + msg.status + ' ' + msg.statusText + ' ' + thrownError);

}

});

Functions.php

Come si può notare la url è admin-ajax.php relativa al CMS WordPress. In questo modo come vedremo tramite le actions potremo intercettare la nostra my_custom_action e fare qualche azione utilizzando i parametri passati tramite POST:

add_action( 'wp_ajax_my_custom_action', 'my_custom_ajax' );
add_action( 'wp_ajax_nopriv_my_custom_action', 'my_custom_ajax' );

function my_custom_ajax() {
    global $wp_query,$paged,$post;

    if( isset ( $_POST['ID'] ) )
    {
       /* il nostro codice che utilizza il POST['ID'] dalla chiamata ajax */
       die();   
    } else {
        die( '-2' );
    }
}

add_action( 'wp_ajax_my_custom_action', 'my_custom_ajax' );

add_action( 'wp_ajax_nopriv_my_custom_action', 'my_custom_ajax' );

function my_custom_ajax() {

global $wp_query,$paged,$post;

if( isset ( $_POST['ID'] ) )

{

/* il nostro codice che utilizza il POST['ID'] dalla chiamata ajax */

die();

} else {

die( '-2' );

}

Ricordiamo che:

wp_ajax_my_custom_action è usato per gli utenti connessi tramite login
wp_ajax_nopriv_my_custom_action è per gli utenti anonimi

Le chiamate Ajax tramite WordPress, come possiamo vedere, sono molto semplici e potenti e con un pò di pratica riuscirete a trasformare il vostro blog in una versione Web 2.0.