Utilisation de getjson

Version imprimable

Bonjour à tous,

j'aurais besoin d'un coup de main. J'ai quelques difficultés à utiliser la fonction
" $.getJSON " de jquery. Tout ce que j'essaye de faire, c'est récupérer une liste depuis un fichier php avec une fonction javascript. Dans cette fonction j'utilise un getJSON, mais je n'arrive pas à récupérer les données.
Voici le code contenant la fonction javascript.

Code:

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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<!--<script scr="jquery-2.0.3.js"></script>-->
<html>
 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Mon premier document PHP</title>
 
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
 
<body>
    <?php
    $con=mysqli_connect("127.0.0.1:3306", "root", "", "hotel");
    // Check connection
    if (mysqli_connect_errno())
      {
      echo "Failed to connect to MySQL: " . mysqli_connect_error();
      }
    $pays = "SELECT DISTINCT country FROM hotelactif";
    $city = "SELECT DISTINCT city FROM hotelactif";
    $prix = "SELECT name FROM hotelactif WHERE highrate >= 100000 AND lowrate <= 100000";
    $test = mysqli_query($con, $pays);
 
 
    $listePays = "<select id='country' name='country '>"; 
    while ($row=mysqli_fetch_array($test)) 
        { 
        $paysSelect = $row['country'];
        $listePays .= "<option value=".$paysSelect.">".$paysSelect."</option>"; 
        } 
    $listePays .= "</select>";
 
 
 
//    while($row = mysqli_fetch_array($test))
//        {
//        echo $row['country'];
//        echo "<br>";
//        }
    mysqli_close($con);
    ?>
 
 
 
<form id=pays action='index.php' method='POST'> 
    <table>
        <tr>
            <td>
                Test
            </td>
            <td>
                <div><?php print $listePays; ?><button onclick="javascript:selectCountry()">Gaufre</button></div>
            </td>
        </tr>   
    </table> 
</form>
 
 
 
<b><?php echo "Bonjour Helpclic" ?>
 
</b>
</body>
</html>

Avant le </body>

Code:

1
2
3
4
5
6
7
8
function selectCountry(){
 
//        alert($('#country').val());
        url = "http://127.0.0.1/Expedia/recuperationDonnee.php/";
        $.getJSON(url, function(data){
            alert();
        })
}

ainsi que la fonction php contenant la liste à récupérer

Code:

1
2
3
4
5
6
7
<?php
    $test["name"] = "test";
    $test["test"] = "test2";
    $test["age"] = "test3";
    echo (json_encode($test));
    return (json_encode($test)); 
?>

J'arrive à rentrer dans la fonction javascript mais je n'arrive pas à faire fonctionner le getJSON.
Pourriez vous me donner un coup de svp?

Merci d'avance

22/11/2013, 08h09
Bovino
Citation:

je n'arrive pas à récupérer les données

C'est sûr qu'avec un simple
Code:

1 2 3 function(data){ alert(); }
tu risques pas de voir grand chose... :roll:

Essaye au moins avec

Code:

alert(data);

par exemple !
22/11/2013, 08h40
SpaceFrog
Code:

1 2 echo (json_encode($test)); return (json_encode($test));
???? echo puis return ????

return n'a pas de sens en dehors du scope de php.

getJson est une requete xhr qui attend donc en retour du string
en l'occurrence JQuery se charge d'interpréter directement lé reponse reçue sous forme de string en objet JSON.
Ton serveur doit retourner une chaine au format string json, ce que se charge de faire echo (json_encode($test));.
22/11/2013, 08h49
dks17

Oui, bien sur. Toutes mes excuses, j'aurais du le préciser. J'ai essayé d'afficher les données en utilisant tour à tour:

- alert(data);
- alert(data.name);
- alert(data[name]);
- alert(data[0]);

Même si cela peut paraître des aberrations, qui ne tente rien ...
Enfin bref, à chaque fois aucune fenêtre avec un message ne s'ouvre.
En fait, même avec alert(), rien ne s'ouvre. Donc je suppose que le problème doit venir de mon appel à la fonction php.
22/11/2013, 08h55
dks17
Citation:
Envoyé par SpaceFrog

Code:

1 2 echo (json_encode($test)); return (json_encode($test));

???? echo puis return ????

return n'a pas de sens en dehors du scope de php.

getJson est une requete xhr qui attend donc en retour du string
en l'occurrence JQuery se charge d'interpréter directement lé reponse reçue sous forme de string en objet JSON.
Ton serveur doit retourner une chaine au format string json, ce que se charge de faire echo (json_encode($test));.
Le echo etait juste là pour vérifier ce que je retournais, à savoir:

{"name":"test","test":"test2","age":"test3"}

Mais qu'il soit là ou pas ne change rien.
22/11/2013, 09h52
SpaceFrog

cela confirme donc que tu es dans l'erreur !!

return ne sert à rien

tu dois faire un echo
22/11/2013, 10h07
dks17

1 pièce(s) jointe(s)

Désolé, je n'avais pas saisi le sens du message. Cependant, cela ne marche toujours pas en enlevant le return.
Par contre, j'ai une nouvelle erreur depuis la console de google chrome.
Voici une capture d'écran de cette erreur, j'ignore si cela peux vous être utile

Pièce jointe 131447

Serait-il possible que la version de jquery que j'utilise (jquery-1.9.1.js) présente une sorte d'incompatibilité ou qu'il me manque des composant de jquery?

Merci d'avance

coté php :

Code:

1
2
3
4
5
6
<?php
    $test["name"] = "test";
    $test["test"] = "test2";
    $test["age"] = "test3";
    echo (json_encode($test));
?>

coté jquery

Code:

1
2
3
$.getJSON(url, function(data){
    console.log(data);
})

et regarde ta console ..

Dans la console google chrome

Code:

1
2
3
4
 
appendChild :chrome-extension://igdhbblpcellaljokkpfhcjlagemhgjl/scripts/minibar/minibar.vars.js contentscript.js:1
appendChild :chrome-extension://igdhbblpcellaljokkpfhcjlagemhgjl/scripts/minibar/minibar.translations.js contentscript.js:1
appendChild :chrome-extension://igdhbblpcellaljokkpfhcjlagemhgjl/scripts/minibar/minibar.min.js contentscript.js:1

et il y a toujours les erreurs présentes dans le network de chrome

dans la console mozilla

Code:

1
2
3
 
[10:40:35.554] POST http://localhost/Expedia/index.php [HTTP/1.1 200 OK 796ms]
[10:40:36.360] Unknown property 'box-sizing'.  Declaration dropped. 3 http://localhost/Expedia/index.php

22/11/2013, 11h00
SpaceFrog

dans l'onglet xhr ...
22/11/2013, 11h10
dks17

Il n'y a absolument rien qui s'affiche dans cette onglet ...
22/11/2013, 11h13
dks17

Cependant, peut-être que je n'utilise pas la bonne méthode pour ce que je veux faire. Tout ce qu'il me faut, c'est récupérer des données depuis une base mysql lorsque je sélectionne une élément d'une liste déroulante (et pourvoir afficher ces données dynamiquement). Je voulais les récupérer en php puis les transmettre au javascript qui se chargerais de modifier le contenu de la page. Mais peut-etre y a t'il un autre moyen?

Merci à vous
22/11/2013, 11h24
SpaceFrog

si tu n'as rein dans l'onglet xhr c'est que ton getJSON n'est même pas lancé, ton js plante avant
22/11/2013, 11h44
dks17

Ben je suppose que c'est fort possible, voir même probable ... mais pourquoi???
Un alert juste avant la fonction getJSON se lance bien ...
22/11/2013, 11h52
Bovino

Est-ce que tu es sûr que ton URL est accessible ?
22/11/2013, 12h29
dks17

l'adresse que je passe dans google chrome est: 127.0.0.1/Expedia/recuperationDonnee.php

j'obtiens sur la page web l'affichage suivant:
{"name":"test","test":"test2","age":"test3"}

Lorsque je fais un copier/coller, j'obtiens cette adresse là:
http://127.0.0.1/Expedia/recuperationDonnee.php

J'ai essayé de mettre les deux adresse dans l'url que je passe à getJSON mais sans changement.
J'ai essayé de passer l'adresse en brut mais sans résultat
23/11/2013, 16h04
dks17

Toujours pas d'amélioration dans mon programme. Des idées s'il vous plait?