appelle fonction get Ajax

Sujet résolu

23 mars 2019 à 13:59:26

Bonjour,

Je voudrais récupérer la réponse de ma fonction Ajax, dans ma console il ya bien marqué que ma variable à été envoyé et devrais être récupérer par mon get ou var_dump cependant je crois que je m'y prend mal lors de la réception car selon moi je l'appel trop tôt.

<?php 
session_start();
?>
<!DOCTYPE html>
<html>
<head>
  <title></title>
  <meta charset="utf-8">
   <link href="bootstrap/css/bootstrap.css" rel="stylesheet">
   <link rel="stylesheet" type="text/css" href="css/acceuil.css">
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
   <script type="text/javascript" src="js/acceuil.js"></script>
    </head>

<body>
	<nav class="">
        <a href="#"><spann class="glyphicon glyphicon-menu-hamburger"></a>
         <a href="#">Acceuil</a>
         <a href="#">Amis</a>
         <a href="#">Compte</a>
         <a href="#"><span class="glyphicon glyphicon-search"></span></a>
         <a href="#"><span class="glyphicon glyphicon-plus-sign"></span></a>
    </nav>
     <div class="container-fluid">
            <div class="row">
                <div class=" col-md-4" id="menu1">lk
                	hnnnn nnn gfbgf bfgb nfgnbs nbcv dv sjhf vhjfh vbh jbf dh jbhjvb chjfb ejhv hjerb hjvbh jbfjbf vhbv hje
                  hnnnn nnn gfbgf bfgb nfgnbs nbcv dv sjhf vhjfh vbh jbf dh jbhjvb chjfb ejhv hjerb hjvbh jbfjbf vhbv hjev
                  hnnnn nnn gfbgf bfgb nfgnbs nbcv dv sjhf vhjfh vbh jbf dh jbhjvb chjfb ejhv hjerb hjvbh jbfjbf vhbv hjev
                  hnnnn nnn gfbgf bfgb nfgnbs nbcv dv sjhf vhjfh vbh jbf dh jbhjvb chjfb ejhv hjerb hjvbh jbfjbf vhbv hjev
                  hnnnn nnn gfbgf bfgb nfgnbs nbcv dv sjhf vhjfh vbh jbf dh jbhjvb chjfb ejhv hjerb hjvbh jbfjbf vhbv hjev
                  hnnnn nnn gfbgf bfgb nfgnbs nbcv dv sjhf vhjfh vbh jbf dh jbhjvb chjfb ejhv hjerb hjvbh jbfjbf vhbv hjev
                  hnnnn nnn gfbgf bfgb nfgnbs nbcv dv sjhf vhjfh vbh jbf dh jbhjvb chjfb ejhv hjerb hjvbh jbfjbf vhbv hjev
                  hnnnn nnn gfbgf bfgb nfgnbs nbcv dv sjhf vhjfh vbh jbf dh jbhjvb chjfb ejhv hjerb hjvbh jbfjbf vhbv hjev

                  hnnnn nnn gfbgf bfgb nfgnbs nbcv dv sjhf vhjfh vbh jbf dh jbhjvb chjfb ejhv hjerb hjvbh jbfjbf vhbv hjev
                  hnnnn nnn gfbgf bfgb nfgnbs nbcv dv sjhf vhjfh vbh jbf dh jbhjvb chjfb ejhv hjerb hjvbh jbfjbf vhbv hjev
                </div>
               

                <div id="menu" class="d-inline-block col-md-4">
                  <div id="sousCategorie">

                    <?php try {
                      $bdd = new pdo('mysql: host=localhost; dbname=people; charset=utf8', 'root', 'root');
                    } 
                
                    catch (Exception $e) {
                       ('Erreur: ' .$e-> getmessage());
                    } 
               

                        var_dump($_GET['s']);
                       if (isset($_SESSION['s'])) {
                           var_dump($_GET['s']);
                        } 
                    
                  
                   

                   

                    $req= $bdd-> prepare('SELECT nomgrp, categorie FROM sousCategorie WHERE categorie = ?'); 
                    $req->execute(array($_GET['s']));
                    
                    $req2 = $req -> fetch();
                    echo '<span class="glyphicon glyphicon-chevron-left pull-left"></span><h3>'.$req2['categorie'].'</h3>';
                    
                   while ($answer= $req -> fetch()) {
                      ?>
                      
                      <button class="col-md-2 btn btn-primary btn-lg"><?php echo $answer['nomgrp'];?></button>
                    <?php }  ?>
                  </div>
                  <div id="categorie"> 
                          <button href="acceuil.php?s=sport" class="col-md-5 btn btn-primary btn-lg" value="sport" name="sport"><span class="glyphicon glyphicon-flash"></span><br/>
                          Sport</button>
                          <button type="submit" type="submit" class="col-md-5 btn btn-primary btn-lg" name="sousCategorie" value="tv"><span class="glyphicon glyphicon-facetime-video"></span></br>Tv</button>
                          <button type="submit" class="col-md-5 btn btn-primary btn-lg" name="ok" value="informatique"><span class="glyphicon glyphicon-console"></span></br>Informatique</button>
                          <button type="submit" class="col-md-5 btn btn-primary btn-lg" name="sousCategorie" value="jeux"><span class="glyphicon glyphicon-phone"></span></br>Jeux vidéo</button>
                          <button type="submit" class="col-md-5 btn btn-primary btn-lg" name="sousCategorie" value="voyage"><span class="glyphicon glyphicon-tent"></span></br>Voyage</button>
                          <button type="submit" class="col-md-5 btn btn-primary btn-lg" name="sousCategorie" value="sortir"><span class="glyphicon glyphicon-glass"></span></br>Sortir</button>
                         <button type="submit" class="col-md-5 btn btn-primary btn-lg" name="sousCategorie" value="politique"><span class="glyphicon glyphicon-briefcase"></span></br>Politique</button>
                         <button type="submit" class="col-md-5 btn btn-primary btn-lg" name="sousCategorie" value="musique"><span class="glyphicon glyphicon-music"></span></br>Musique</button>
                         <button type="submit" class="col-md-5 btn btn-primary btn-lg" name="sousCategorie" value="santé"><span class="glyphicon glyphicon-grain "></span></br>Santé</button>
                         <button type="submit" class="col-md-5 btn btn-primary btn-lg" name="sousCategorie" value="nature"><span class="glyphicon glyphicon-leaf"></span></br>Nature</button>
                         <button type="submit" class="col-md-5 btn btn-primary btn-lg" name="sousCategorie" value="econonmie"><span class=" glyphicon glyphicon-usd"></span></br>Economie</button>
                         <button type="submit" class="col-md-5 btn btn-primary btn-lg" name="sousCategorie" value="droit"><span class="glyphicon glyphicon-book"></span></br>Droit</button>
                         <button type="submit" class="col-md-5 btn btn-primary btn-lg" name="sousCategorie" value="autre"><span class="glyphicon glyphicon-shopping-cart"></span></br>Autre</button>
                   </div>
                </div>
                <div id="new" class="col-md-3 pull-right btn-group">
                      <button type="button" class="col-md-6 btn btn-group btn-default " >Nouveau message</button>
                      <button type="button" class="col-md-6 btn btn-group btn-default">Nouveau groupe</button>
                        <form id="formMsg">
                            <input type="text" name="destinataire" class="col-md-12" placeholder="Destinataire">
                            <textarea name="message" placeholder="message" rows="4" class="col-md-12"></textarea>
                            <input type="submit" name="Envoyer" class="col-md-offset-2 col-md-8 btn-custom">    
                        </form>
                        <form id="formGrp" method="POST" action="newcategorie.php">
                            <input type="text" name="nomgrp" placeholder="Nom Groupe" class="col-md-12">
                            <select class="col-md-12" name="categorie">
                                <option value="sport">Sport</option>
                                <option value="tv">Tv</option>
                                <option value="informatique">Informatique</option>
                                <option value="jeux">Jeux vidéo</option>
                                <option value="voyage">Voyage</option>
                                <option value="sortir">Sortir</option>
                                <option value="politique">Politique</option>
                                <option value="musique">Musique</option>
                                <option value="santé">Santé</option>
                                <option value="nature">Nature</option>
                                <option value="econonmie">Economie</option>
                                <option value="droit">Droit</option>
                                <option value="autre">Autre</option>
                              </select>
                            <input type="submit" name="creer" value="Créer" class="col-md-offset-2 col-md-8 btn-custom">
                        </form>
         
                </div>
                <div id="listeMsg">
                
                </div>

            </div>    
        </div>  

</body>

</html>

$(document).ready(function(){
	$('#menu').hide();
	$('#new').hide();
    
    $('#menu button').click(function(event){
    	var c = event.target.name;

    alert(event.target.value);
         $.ajax({
            type: "GET",
            url: "acceuil.php",
            data: { s: c} 
        });

	        $('#categorie').hide();
    	    $('#sousCategorie').show();
    	    
    	    $('.glyphicon-chevron-left').click(function(){
              $('#categorie').show();
    	      $('#sousCategorie').hide();
            });
    });

axldenied

23 mars 2019 à 18:53:25

Bonjour,

Je ne suis pas convaincu de la méthode utilisé, en effet, faire un appel Get sur la page d'accueil renverra le contenu complet de la page.

Ensuite, pour répondre à ta question, le soucis de ton code n'est pas que tu l'appel trop tot, c'est surtout que tu ne fait rien de la réponse.

si tu regardes l'exemple du cours suivant : https://openclassrooms.com/fr/courses/1567926-un-site-web-dynamique-avec-jquery/1569648-le-fonctionnement-de-ajax, tu remarques que tu as besoin d'avoir une fonction qui traite la réponse :

$.ajax({
       url : 'more_com.php',
       type : 'GET',
       dataType : 'html', // On désire recevoir du HTML
       success : function(code_html, statut){ // code_html contient le HTML renvoyé
           
       }
    });

Je pense que si tu ajoutes cette foinction tu retrouveras le contenu de ta variable dans ta console.

Bon courage

benjamin.lhomme

23 mars 2019 à 19:54:03

Merci de ta réponse , mais ce que je n'arrive toujours pas à comprendre c'est pourquoi les fichiers de type xhr des sites s'ouvre et ferme le document de base, et quand à moi je suis obligé de l'ouvrir grâce à la console.

Mon fichier ne devrait pas se mettre en cache automatiquement pour laisser la place au fichier xhr?

Je voudrais juste récupérer ma variable 's' avec un get ou un post si c'est mieux mais j'ai lu que les post était juste pour les formulaires.

axldenied a écrit:

Bonjour,

Je ne suis pas convaincu de la méthode utilisé, en effet, faire un appel Get sur la page d'accueil renverra le contenu complet de la page.

Ensuite, pour répondre à ta question, le soucis de ton code n'est pas que tu l'appel trop tot, c'est surtout que tu ne fait rien de la réponse.

si tu regardes l'exemple du cours suivant : https://openclassrooms.com/fr/courses/1567926-un-site-web-dynamique-avec-jquery/1569648-le-fonctionnement-de-ajax, tu remarques que tu as besoin d'avoir une fonction qui traite la réponse :
$.ajax({
       url : 'more_com.php',
       type : 'GET',
       dataType : 'html', // On désire recevoir du HTML
       success : function(code_html, statut){ // code_html contient le HTML renvoyé
           
       }
    });
Je pense que si tu ajoutes cette foinction tu retrouveras le contenu de ta variable dans ta console.

Bon courage

-
Edité par benjamin.lhomme 23 mars 2019 à 19:57:32

axldenied

26 mars 2019 à 20:11:04

BL2 a écrit:

Merci de ta réponse , mais ce que je n'arrive toujours pas à comprendre c'est pourquoi les fichiers de type xhr des sites s'ouvre et ferme le document de base, et quand à moi je suis obligé de l'ouvrir grâce à la console.

Mon fichier ne devrait pas se mettre en cache automatiquement pour laisser la place au fichier xhr?

Je voudrais juste récupérer ma variable 's' avec un get ou un post si c'est mieux mais j'ai lu que les post était juste pour les formulaires.

-
Edité par BL2 23 mars 2019 à 19:57:32

Bonsoir,

J'avoue ne pas trop saisir la question relative aux XHR.

Pour le reste, si ton but est de ne récupérer que la variable 's' il est nécessaire que la page ne renvoi que le contenu de cette variable et pas tout une page avec du HTML etc ....

Pour le reste le fait d'utiliser la méthode GET ou POST cela dépende de ce que tu veux faire.

(il est tout a fait possibe d'utiliser GET ou POST pour des formulaires)

Afin de mieux saisir, je pense que tu devrais te sortir de ton code et utiliser un outils type postman afin d'executer manuellement tes requêtes (POST , GET ou autre) cela te permettrait peut être de mieux appréhender ce que tu fais, et de mieux comprendre ce que fait ton code.

En effet quand tu fait un GET sur une adresse, ou sur une de tes pages locales le résultat contiendra tout le contenu de la page et pas seulement une partie.

Bon courage.