WordPress: comment appeler un plugin de fonctionner avec un appel ajax?

Je suis en train d'écrire un plugin WordPress MU, il inclut un lien avec chaque poste, et je veux utiliser ajax pour appeler l'un de l'plugin fonctionne lorsque l'utilisateur clique sur ce lien, puis mettre à jour dynamiquement le lien texte avec la sortie de la fonction.

Je suis coincé avec la requête ajax. J'ai eu cette compliqué, clairement hack-ish, la façon de le faire, mais il n'est pas assez de travail. Quelle est la "bonne" ou "wordpress" de manière à inclure des fonctionnalités ajax dans un plugin?

(Mon hack code est ci-dessous. Lorsque je clique sur le lien générer je n'ai pas la même sortie que je reçois dans la page wp que quand je vais directement à sample-ajax.php dans mon navigateur.)

J'ai obtenu mon code[1] défini comme suit:

mu-plugins/sample.php:

<?php
/*
Plugin Name: Sample Plugin
*/
if (!class_exists("SamplePlugin")) {
  class SamplePlugin {
    function SamplePlugin() {}
    function addHeaderCode() {
      echo '<link type="text/css"  href="'.get_bloginfo('wpurl').
             '/wp-content/mu-plugins/sample/sample.css" />\n';
      wp_enqueue_script('sample-ajax', get_bloginfo('wpurl') .
             '/wp-content/mu-plugins/sample/sample-ajax.js.php',
             array('jquery'), '1.0');

    }
    //adds the link to post content.
    function addLink($content = '') {
        $content .= "<span class='foobar clicked'><a href='#'>click</a></span>";
        return $content;
    }
    function doAjax() { //
        echo "<a href='#'>AJAX!</a>";
    } 
  }
}
if (class_exists("SamplePlugin")) {
  $sample_plugin = new SamplePlugin();
}
if (isset($sample_plugin)) {
  add_action('wp_head',array(&$sample_plugin,'addHeaderCode'),1);
  add_filter('the_content', array(&$sample_plugin, 'addLink'));
}

mu-plugins/sample/sample-ajax.js.php:

<?php
if (!function_exists('add_action')) {
    require_once("../../../wp-config.php");
}
?>
jQuery(document).ready(function(){
    jQuery(".foobar").bind("click", function() {
        var aref = this;
        jQuery(this).toggleClass('clicked');
        jQuery.ajax({
          url: "http://mysite/wp-content/mu-plugins/sample/sample-ajax.php",
          success: function(value) {
            jQuery(aref).html(value);
          }
        });
    });
});

mu-plugins/sample/sample-ajax.php:

<?php
if (!function_exists('add_action')) {
  require_once("../../../wp-config.php");
}
if (isset($sample_plugin)) {
  $sample_plugin->doAjax();
} else {
  echo "unset";
}
?>

[1] Note: Le tutoriel ci-dessous m'a fait beaucoup de chemin, mais je suis perplexe à ce point.
http://www.devlounge.net/articles/using-ajax-with-your-wordpress-plugin

OriginalL'auteur Bee | 2010-05-25

22

TheDeadMedic n'est pas tout à fait droit. WordPress a construit en AJAX capacités. Envoyer votre requête ajax /wp-admin/admin-ajax.php à l'aide de POST avec l'argument de "l'action":
```
jQuery(document).ready(function(){
    jQuery(".foobar").bind("click", function() {
        jQuery(this).toggleClass('clicked');
        jQuery.ajax({
          type:'POST',
          data:{action:'my_unique_action'},
          url: "http://mysite/wp-admin/admin-ajax.php",
          success: function(value) {
            jQuery(this).html(value);
          }
        });
    });
});
```
Puis de le brancher dans le plugin de ce genre si vous ne souhaitez que cela fonctionne pour les utilisateurs enregistrés:
```
add_action('wp_ajax_my_unique_action',array($sample_plugin,'doAjax'));
```
ou l'accrocher comme cela fonctionne uniquement pour les non-utilisateurs enregistrés:
```
add_action('wp_ajax_nopriv_my_unique_action',array($sample_plugin,'doAjax'));
```
Utiliser à la fois si vous voulez que cela fonctionne pour tout le monde.

admin-ajax.php utilise des noms d'action déjà, alors assurez-vous de regarder à travers le fichier et ne pas utiliser les mêmes noms d'action, ou bien vous allez accidentellement essayer de faire des choses comme supprimer des commentaires, etc.

MODIFIER

Désolé, je n'ai pas très bien compris la question. Je pensais que vous étiez demandant comment faire une requête ajax. En tout cas, deux choses que je voudrais essayer:

D'abord, demandez à votre fonction echo juste le mot AJAX sans a tag. Ensuite, essayez de changer votre appel ajax, donc il a à la fois un succès et un rappel:
```
jQuery(document).ready(function(){
    jQuery(".foobar").bind("click", function() {
        var val = '';
        jQuery(this).toggleClass('clicked');
        jQuery.ajax({
          type:'POST',
          data:{action:'my_unique_action'},
          url: "http://mysite/wp-admin/admin-ajax.php",
          success: function(value) {
            val = value;
          },
          complete: function(){
            jQuery(this).html(val);
          }
        });
    });
});
```
J'ai oublié d'ajouter que admin-ajax.php prend en charge le chargement de l'ensemble de WordPress environnement, de sorte que vous n'avez pas besoin de vous soucier y compris tous les fichiers dans votre plugin.
L'original de votre réponse a été grande. Merci pour me montrer la bonne façon de faire de l'ajax dans wp. Votre explication est claire ce que j'ai vu dans un autre code que j'ai lu. Note: j'ai aussi eu un javascript de délimitation de l'étendue de l'erreur que j'ai corrigé ci-dessus dans la question, de sorte qu'il pourrait être plus utile wp de renvoi d'une question que d'un "corriger mon bug aussi con' question. (faisait référence à "ceci" à l'intérieur de la réussite fn pour l'appel ajax).
John P est mort, je ne m'en excuse, ma solution est pas le seul moyen, mais c'est une méthode que j'ai trouver facile, rapide AJAX, sans avoir à les charger WordPress moi-même.
J'ai oublié de mentionner dans Jean-P de la méthode, vous pouvez utiliser la variable JavaScript ajaxurl plutôt que de coder en dur l'URL (ou de la propriété userSettings.ajaxurl dans la note WP 3.0).
Où dois-je mettre de la fonction jQuery ?, dans quel fichier ?

OriginalL'auteur John P Bloch

WordPress environnement

Tout d'abord, afin de réaliser cette tâche, il est recommandé de s'inscrire puis de mise en file d'un script jQuery qui va faire la demande au serveur. Ces opérations sera accroché dans wp_enqueue_scripts action crochet. Dans le même crochet, vous devriez mettre wp_localize_script qu'il est utilisé pour inclure Javascript arbitraire. De cette manière, il y aura un JS objet disponible en front-end. Cet objet porte sur l'url correcte pour être utilisé par le jQuery poignée.

Veuillez jeter un oeil à:

Fichier: functions.php 1/2

add_action( 'wp_enqueue_scripts', 'so_enqueue_scripts' );
function so_enqueue_scripts(){
  wp_register_script( 'ajaxHandle', get_template_directory() . 'PATH TO YOUR JS FILE', array(), false, true );
  wp_enqueue_script( 'ajaxHandle' );
  wp_localize_script( 'ajaxHandle', 'ajax_object', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) );
}

Fichier: jquery.ajax.js

Ce fichier fait l'appel ajax.

jQuery(document).ready( function($){
  //Some event will trigger the ajax call, you can push whatever data to the server, simply passing it to the "data" object in ajax call
  $.ajax({
    url: ajax_object.ajaxurl, //this is the object instantiated in wp_localize_script function
    type: 'POST',
    data:{
      action: 'myaction', //this is the function in your functions.php that will be triggered
      name: 'John',
      age: '38'
    },
    success: function( data ){
      //Do something with the result from server
      console.log( data );
    }
  });
});

Fichier: functions.php 2/2

Enfin sur votre functions.php fichier il doit y avoir la fonction déclenchée par votre appel ajax.
Rappelez-vous les suffixes:

wp_ajax ( permettre à la fonction uniquement pour les utilisateurs enregistrés ou le panneau d'administration des opérations )
wp_ajax_nopriv ( permettre à la fonction pour pas le privilège des utilisateurs )

Ces suffixes, plus l'action de composer le nom de votre action:

wp_ajax_myaction ou wp_ajax_nopriv_myaction

add_action( 'wp_ajax_myaction', 'so_wp_ajax_function' );
add_action( 'wp_ajax_nopriv_myaction', 'so_wp_ajax_function' );
function so_wp_ajax_function(){
  //DO whatever you want with data posted
  //To send back a response you have to echo the result!
  echo $_POST['name'];
  echo $_POST['age'];
  wp_die(); //ajax call must die to avoid trailing 0 in your response
}

Espère que cela aide!

Laissez-moi savoir si quelque chose n'est pas clair.

add_action( 'wp_ajax_nopriv_myaction', 'so_wp_ajax_function' );

OriginalL'auteur rams0610

Il suffit d'ajouter une information.
Si vous souhaitez recevoir un objet à partir d'une classe php méthode de la fonction :

fichier js

jQuery(document).ready(function(){
jQuery(".foobar").bind("click", function() {
    var data = {
        'action': 'getAllOptionsByAjax',
        'arg1': 'val1',
        'arg2': $(this).val() 
    };
    jQuery.post( ajaxurl, data, function(response) {
       var jsonObj = JSON.parse( response );
    });
});

fichier php

public static function getAllOptionsByAjax(){

    global $wpdb;

    //Start query string
    $query_string  =  "SELECT * FROM wp_your_table WHERE col1='" . $_POST['arg1'] . "' AND col2 = '" . $_POST['arg2'] . "' ";

    //Return results
    $a_options = $wpdb->get_results( $query_string, ARRAY_A );
    $f_options = array();
    $f_options[null] =  __( 'Please select an item', 'my_domain' );
    foreach ($a_options as $option){
        $f_options [$option['id']] = $option['name'];
    }
    $json = json_encode( $f_options );
    echo $json;
    wp_die();
}

OriginalL'auteur J.BizMai

Vous devez vous connecter pour publier un commentaire.