web-dev-qa-db-fra.com

En utilisant AJAX dans FrontEnd avec Wordpress Plugin Boilerplate (wppb.io)

J'essaie de faire une boîte de balise similaire à celle du backend, mais pour le frontend. J'utilise AJAX pour obtenir des suggestions de balises lorsque l'utilisateur tape dans le champ de saisie.

J'ai utilisé AJAX dans Wordpress par le passé, sans problème de thèmes, etc., mais pour le moment, j'essaie de construire un plugin et comme c'est beaucoup plus compliqué, j'essaie de passer à l'objet- orienté avec Wordpress Plugin Boilerplate (wppb.io) comme base.

Mais je ne peux pas le faire fonctionner en utilisant le passe-partout. L'appel AJAX fonctionne, mais succès: fonction (donnée) renvoie toujours 0 lorsqu'il doit renvoyer 'testing', ce qui me fait penser que ma fonction n'est jamais appelée. J'ai passé des heures à ça et je ne vois pas l'erreur

Ceci est mon code:

/public/js/my-plugin-public.js

$('#my_plugin_tags').keyup(function() {

    var user_input = $(this).val();
    var user_input_last = $.trim(user_input.split(',').pop());

    $.ajax({
        url: my-plugin.ajax_url,
        type: 'POST',
        data: {
            'user_input': user_input_last
        },
        success:function(data) {
            console.log(data);
        },
        error: function(errorThrown){
            console.log(errorThrown);
        }
    });

});

/public/class-my-plugin-public.php

/**
 * Register the JavaScript for the public-facing side of the site.
 *
 * @since    1.0.0
 */
public function enqueue_scripts() {
    wp_enqueue_script( 'my-plugin-public', plugin_dir_url( __FILE__)  . 'js/my-plugin-public.js', array( 'jquery' , $this->plugin_name ), $this->version, false );          
    wp_localize_script( 'my-plugin-public', 'my-plugin' , array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );

}

/public/class-my-plugin-class-public.php

/**
  * Get tag suggestions from while user writes
  *
  * @since      1.0.0
  */

public function tags_autofill_function() {
    echo('Testing');
}

/includes/class-my-plugin.php

/**
 * Register all of the hooks related to the public-facing functionality
 * of the plugin.
 *
 * @since    1.0.0
 * @access   private
 */
private function define_public_hooks() {

    // Load CSS & Scripts
    $plugin_public = new My_Plugin_Public( $this->get_plugin_name(), $this->get_version() );

    $this->loader->add_action( 'wp_enqueue_scripts', $plugin_public, 'enqueue_styles' );
    $this->loader->add_action( 'wp_enqueue_scripts', $plugin_public, 'enqueue_scripts' );

    // Custom Class from My Plugin
    $plugin_class_public = new My_Plugin_Class_Public();

    $this->loader->add_action( 'wp_ajax_tags_autofill_function', $plugin_class_public , 'tags_autofill_function' );
    $this->loader->add_action( 'wp_ajax_nopriv_tags_autofill_function', $plugin_class_public , 'tags_autofill_function' );

}
plugin-developmentajax
2
Sandra

Il n'y a pas de variable action sur les données que vous transmettez à Ajax. De cette façon, WordPress envoie seulement un appel générique à Ajax qui renvoie toujours 0. Vous devez modifier vos données sur votre fichier JS en quelque chose comme:

    data: {
        'user_input': user_input_last,
        'action': 'tags_autofill_function'
    },
3
Bruno Cantuaria