IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

AJAX Discussion :

Récupérer et afficher des données


Sujet :

AJAX

  1. #1
    Membre confirmé
    Homme Profil pro
    Autre
    Inscrit en
    Mars 2021
    Messages
    206
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 56
    Localisation : France, Mayenne (Pays de la Loire)

    Informations professionnelles :
    Activité : Autre

    Informations forums :
    Inscription : Mars 2021
    Messages : 206
    Par défaut Récupérer et afficher des données
    Bonjour,
    je viens de commencer d'apprendre et de comprendre l'AJAX en m'aidant de cours et video etc.
    J'essaie un exercice mais je n'arrive pas à trouver l'erreur : quand je clique sur une des deux villes, dans la div en sous je voudrais afficher le code de la page php.. mais rien se passe
    Voici mes codes :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
     function getxhr()
     {
        return new XMLHttpRequest(); 
     }
     
     
    let links = document.querySelectorAll('.meteo')
    let result =document.querySelector('result')
     
    for(let i = 0; i < links.length; i++) {
       let link = links[i]
       link.addEventListener('click', function (e) {
          e.preventDefault();
          result.innerHTML="chargement"
     
          let req = getxhr();
     
          req.onreadystatechange = function()
          {
             if(req.readyState==4 && req.status==200)
             {
             result.innerHTML=req.responseText;
             }
          }
     
             req.open('GET', this.getAttribute('href'), true);
     
             req.send();
     
          })
    }
    Mon html
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    <body>
        <ul>
         <li><a class="meteo" href="ville.php?ville=Paris">Paris</a></li>
         <li><a class="meteo" href="ville.php?ville=Rennes">Rennes</a></li>
        </ul>  
        <div id="result"></div>
        <script src="monApp.js"></script>
    </body>

    php
    Code php : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    <?php 
    $ville =$_GET['ville'];
    echo 'il fait beau a '.$ville;
    ?>
    merci pour votre aide

  2. #2
    Expert confirmé
    Avatar de mathieu
    Profil pro
    Inscrit en
    Juin 2003
    Messages
    10 670
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2003
    Messages : 10 670
    Par défaut
    regardez dans la console de développement de votre navigateur, vous avez une erreur javascript.

    une fois que vous aurez corrigé cette erreur, l'appel ajax fonctionnera. mais si vous voulez pousser l'exercice un peu plus loin, je vous propose de ne plus utiliser XMLHttpRequest mais de refaire l'appel ajax avec la fonction fetch :
    https://developer.mozilla.org/fr/doc...PI/Using_Fetch
    cette fonction est plus récente et je pense que votre code sera plus clair en l'utilisant.

  3. #3
    Membre confirmé
    Homme Profil pro
    Autre
    Inscrit en
    Mars 2021
    Messages
    206
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 56
    Localisation : France, Mayenne (Pays de la Loire)

    Informations professionnelles :
    Activité : Autre

    Informations forums :
    Inscription : Mars 2021
    Messages : 206
    Par défaut
    Bonjour,
    La prochaine fois je ferai appel à la console avant de poster sur le forum, en étant débutant je n'ai pas ce reflexe.
    Problème résolu sur les deux lignes:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
     
    let result =document.getElementById("result")
    result.innerHTML="chargement"
    Merci pour votre conseil je vais lire la documentation sur cette fonction.
    Bonne journée

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Réponses: 5
    Dernier message: 09/05/2007, 13h35
  2. [AJAX] Besoin d'aide sur AJAX ...
    Par kcizth dans le forum Général JavaScript
    Réponses: 9
    Dernier message: 05/04/2006, 09h45
  3. Aide Probléme Connxion ADSL
    Par amazircool dans le forum Dépannage et Assistance
    Réponses: 4
    Dernier message: 19/03/2006, 23h09
  4. Aide: Problème avec la taille de mon fichier
    Par ATTIA dans le forum Langage
    Réponses: 6
    Dernier message: 15/03/2006, 10h19
  5. de l'aide, problème avec lecteur CD/graveur
    Par princetn dans le forum Périphériques
    Réponses: 2
    Dernier message: 18/02/2006, 06h37

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo