web-dev-qa-db-fra.com

Comment puis-je courir AJAX sur un événement de clic de bouton?

Mise à jour: J'ai réussi à faire fonctionner le AJAX, mais pas dans l'événement click. J'ai mis à jour la question pour correspondre à cela.

J'essaie du code trouvé sur la page: 'AJAX in Plugins' .

Cependant, je ne peux pas le faire fonctionner et je ne sais pas vraiment par où commencer. Cela fonctionne lorsque je supprime la fonction click et que je lance simplement le code sur pageload.

J'ai un fichier Javascript qui ressemble à ceci:

jQuery(document).ready(function(){
    jQuery("#createremotesafe").click(function(){
        alert ('test');
        var data = {
            action: 'my_action',
            whatever: 1234
        };

        // since 2.8 ajaxurl is always defined in the admin header and points to admin-ajax.php

        jQuery.post(ajaxurl, data, function(response) {
            alert('Got this from the server: ' + response);
        });
    });    
});

et quelque part dans mon script PHP qui génère le bouton qui doit exécuter le code JavaScript (c'est-à-dire la page d'administration), ainsi que le reste de la page:

add_action('wp_ajax_my_action', 'my_action_callback');
echo 'test2';
function my_action_callback() {
  global $wpdb; // this is how you get access to the database
  $whatever = $_POST['whatever'];
  $whatever += 10;
  echo $whatever;
  die(); // this is required to return a proper result
}

Je reçois à la fois Alert ('test') et echo 'test2', mais pas l'alerte de réponse. Il n'y a pas d'erreur Javascript ou quoi que ce soit. Mon code est définitivement en cours d'exécution, car je peux voir les deux tests, mais pourquoi AJAX n'obtient-il aucune réponse? Est-ce que ma fonction php disparaît après le chargement de la page? Peut-être que je ne peux pas/ne devrais pas utiliser les fonctions intégrées dans wp AJAX?

De plus, il ne montre pas de boîte d'alerte vide, mais rien ne se passe.

plugin-developmentjavascriptajax
7
joon

Commencez avec une base de code de travail.

add_action('in_admin_header', 'my_ajax_button');

function my_ajax_button() {
    echo '<a href="#ajaxthing" class="myajax">Test</a>';
}

add_action('admin_head', 'my_action_javascript');

function my_action_javascript() {
?>
<script type="text/javascript" >
jQuery(document).ready(function($) {

    $('.myajax').click(function(){
        var data = {
            action: 'my_action',
            whatever: 1234
        };

        // since 2.8 ajaxurl is always defined in the admin header and points to admin-ajax.php
        $.post(ajaxurl, data, function(response) {
            alert('Got this from the server: ' + response);
        });
    });


});
</script>
<?php
}

add_action('wp_ajax_my_action', 'my_action_callback');

function my_action_callback() {
     global $wpdb; // this is how you get access to the database

     $whatever = $_POST['whatever'];

     $whatever += 10;

             echo $whatever;

     exit(); // this is required to return a proper result & exit is faster than die();
}

C'est le code (avec un ajustement mineur) de la page du codex, et c'est très bien comme ça, donc je suggérerais de l'utiliser comme point de départ. Si c'est ce que vous avez fait au début, à quel moment cela s'est-il cassé ou a cessé de fonctionner ?

NOTE: Mark, c'est moi, j'utilise un compte secondaire pour accéder au site depuis un autre PC (qui n'est pas le mien).

8
t31os