Bonjour,

Je cherche comment faire passer une requête en ajax.

Je n'ai pas compris le fonctionnent de la balise image. Sorry :/

J'ai mes trois onglets sur le côté gauche, actuellement j'ai déjà un code jquery pour gérer les onglets, ainsi il remplace le contenu à droite par le craft ou par la description.

Le problème c'est que j'affiche ceci une centaine de fois par page et donc j'aimerai que quand l'on clique sur craft, une requête se fasse dans mon controller en ajax pour éviter de devoir faire une centaine de requête en même temps.

J'ai regarder le tutoriel dez grafikart sur l'ajax mais il ne traite pas du tout le faite de faire des requête en bdd et j'ai beau chercher je trouve rien ...

Si quelqu'un pourrait m'expliquer un petit peu, ou me donner quelque piste.

Merci d'avance.

10 réponses


alexandreg
Réponse acceptée

Tu peux essayer quelque chose de plus basique comme ca et voir ce que ca donne

$('#ton_lien').on('click', function(e){
    e.preventDefault();
    $.get("<?= $this->Html->url( array( 'controller' => 'equipements', 'action' => 'craft' ), true ); ?>")
    .done(function(data, textStatus, jqXHR) {
        alert( "success" );
        console.log(data);
        console.log(textStatus);
        console.log(jqXHR.responseText);
    })
    .fail(function(jqxhr, textStatus, errorThrown) {
        alert( "error");
        console.log(jqxhr.responseText);
        console.log(textStatus);
        console.log(errorThrown);
    })
});

Hello,
Personnellement j'utilise jquery .get() avec un url de cakephp

Dans ta vue :

$.ajax({
  url: <?= $this->Html->url( array( 'controller' => 'ton_controller', 'action' => 'ton_action_ajax' ), true ); ?>,
  data: {id:ton_id},
  success: function( data ) {
    var obj = jQuery.parseJSON( data );
    $('#ta_div').html( obj.content );
    }
});

Dans ton controller

    public function ton_action_ajax()
    {
        if ( $this->request->is('ajax') )
        {
            if ( !empty($this->request->query['id']) )
            {
                $results = $this->TonModel->find('all');
                $view = new View($this, false); // on fabrique une vue
                $view->set(compact('results));
                $ret['content'] = $view->render('vue-de-ton-action-ajax', ''); // on met soit un layout vide, soit un spécial vue ajax
            }
            else
            {
                $ret['content'] = '';
            }
            echo json_encode( $ret );
            exit();
        }
    }
Tchoupi
Auteur

Merci de ton aide.

Voici le code que j'ai refais :

$.ajax({
     url: <?= $this->Html->url( array( 'controller' => 'equipements', 'action' => 'craft' ), true ); ?>,
     data: {id: <?= $item['Equipement']['id'] ?>},
     success: function( data ) {
         var obj = jQuery.parseJSON( data );
         $('.item-craft').html( obj.content );
     }
});

Petite question aussi. dans le code tu as mis "obj.content" le content équivaut à quoi ?

Mais rien se passe, j'ai même pas l'impression qu'il aille à mon lien.

Plusieurs petites choses :
le data{id:XXX} , personnellement je le récupère dans le DOM avec un sélecteur jquery et pas en dur avec php, sinon il suffit directement de le passer en lien $this->Html->url( array( 'controller' => 'equipements', 'action' => 'craft', 'id'=> $item['Equipement']['id']).
L'intéret de le récupérer dans le DOM, par exemple au travers d'un attribut html type : data-itemid="<?= $item['Equipement']['id'] ?>", c'est que tu fais une seul fois le code JS en faisant un sélecteur de tous les <a data-itemid></a> et en récupérant la valeur de data-itemid.

Ensuite obj est la version 'array' de data, je peux ainsi y naviguer plus facilement.
Data c'est ce que me renvoie la page php que j'ai appelé avec .get(), c'est à dire le $ret encodé en JSON.
Pour moi $ret est un tableau qui contient tout ce que j'ai besoin, y compris une clé 'content' et sa valeur qui est un bout de page html.
Donc il est normal d'afficher obj.content en contenu html de ma div.

Je te conseille d'une part de bien vérifier que ton action retourne bien ce que tu veux (en passant par une requete http classique, c'est à dire pas ajax),
puis de tester ton code js, avec des console.log() et des arrêts de scripts à des moments clés.

Tchoupi
Auteur

J'ai regarder avec le debug de chrome dans XHR, je n'ai aucune page d'appelé quand je clique...
L'action que j'appelle, fait une requête en bdd avec l'ID en voyant avant, et après je traite les donnée, je fais des explode, des str_replace et autres, et ainsi je renvoi mes données traité à la vue.
Mais pour l'instant je ne fais pas tous les traitements simple et bonne raison parce que j'attends que l'ajax fonctionne.
Et pour le moment rien ne fonctionne.
Depuis tout à l'heure je suis dessus, mais je vois pas d'où ça cloche ...

Bref, je vais continuer à chercher.

Tchoupi
Auteur

Salut,

Merci pour ton aide.

Le retour est Error.

Par contre sous safari ça ne fonctionne pas. Je vais regarder pourquoi.

le alert 'error' c'est juste le haut de l'iceberg, regarde le log dans ta console pour voir ce qui ne va pas.
ensuite vérifie la version de jquery que tu charges, etc...

Tchoupi
Auteur

C'est bon, j'ai trouvé où sa n'allait pas... C'est l'url, il faut que je la l'écrive en brut.

Problème résolu ?

Tchoupi
Auteur

Plus ou moins, mais j'ai complètement changer la méthode
Voir ici.

Mais merci pour ton aide, ça ma fais beaucoup apprendre.