Parser un tableau dans un fichier JSON

Version imprimable

Bonjour à toutes et tous,

je voulais parser un fichier JSON avec HTML, le fichier est le suivant:

Code:

1
2
3
4
5
6
7
8
{
"menu":[
    {"id": "TN", "value": "ar"} ,
    {"id": "FR", "value": "fr"} ,
    {"id": "GB", "value": "en"} ,
    {"id": "US", "value": "en"} 
],
}

voici la page HTML que je l'utilise:

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
<!DOCTYPE html><!--HTML5 doctype-->
<html>
<head>
	<title>Your New Application</title>
	<meta http-equiv="Content-type" content="text/html; charset=utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0" />
	<style type="text/css">
		/* Prevent copy paste for all elements except text fields */
		*  { -webkit-user-select:none; -webkit-tap-highlight-color:rgba(255, 255, 255, 0); }
		input, textarea  { -webkit-user-select:text; }
		body { background-color:white; color:black }
	</style>
 
	<script type="text/javascript">
		/* This code is used to run as soon as Intel activates */
		var onDeviceReady=function(){
		//hide splash screen
		intel.xdk.device.hideSplashScreen();
		};
		document.addEventListener("intel.xdk.device.ready",onDeviceReady,false);
	</script>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script>
 
        //When DOM loaded we attach click event to button
        $(document).ready(function() {
 
            //after button is clicked we download the data
            $('.button').click(function(){
 
                //start ajax request
                $.ajax({
                    url: "pays.json",
                    //force to handle it as text
                    dataType: "text",
                    success: function(data) {
 
                        //data downloaded so we call parseJSON function 
                        //and pass downloaded data
                        var json = $.parseJSON(data);
                        //now json variable contains data in json format
                        //let's display a few items
                        $('#results').html('Country: ' + json.menu.id[0] + '<br />Language: ' + json.menu.value[0]);
                    }
                });
            });
        });
    </script>
 
</head>
<body>
    <a href="pays.json" target="_blank">Open JSON file</a><br />
    <input type="button" value="Get and parse JSON" class="button" />
    <br />
    <span id="results"></span>
</body>
</html>

Le problème lorsque j'exécute, je ne reçoit rien en cliquant sur le bouton "Get and parse JSON". Je me demande comment faire pour afficher le contenu de mon fichier JSON. :weird:

Merci!

Code:

dataType: "text",

Code:

dataType: "json",

et tu reçois un json directement

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
$.ajax({
	url: "pays.json",
	//force to handle it as text
	dataType: "json",
	success: function(data) {
 
		//data downloaded so we call parseJSON function 
		//and pass downloaded data
		//now json variable contains data in json format
		//let's display a few items
		$('#results').html('Country: ' + data['menu'][0]['id'] + '<br />Language: ' + data['menu'][0]['value']);
	}
});
});

Edit:

SANS SE TROMPER DANS LES INDEXES ENTRE ARRAY ET JSON ...

24/03/2014, 17h16
L'aigle de Carthage

J'ai testé votre code mais rien ne s'affiche dans la balise <span> :calim2:

En contre partie, est ce que mon fichier JSON est correcte syntaxiquement? :roll:
25/03/2014, 08h40
SpaceFrog

Vérifie dans la console (firebug) l'état des échanges xhr ...

sinon pour ce qui est du format du json
http://jsfiddle.net/uM35r/ devrait répondre à ta question
25/03/2014, 09h42
Bovino

Citation:

Envoyé par L'aigle de Carthage

est ce que mon fichier JSON est correcte syntaxiquement?

Citation:

Envoyé par SpaceFrog

SANS SE TROMPER DANS LES INDEXES ENTRE ARRAY ET JSON ...

La réponse a déjà été donnée !

Ton JSON est syntaxiquement correct, mais le traitement est incohérent avec sa structure...

Bonjour,

En parlant du syntaxe, je voudrais savoir comment faire pour parser ce code:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
{
"licenses": [
        {
            "type": "Apache",
            "url": "http://www.apache.org/licenses/LICENSE-2.0"
        },
        {
            "type": "GPL v2",
            "url": "http://www.gnu.org/licenses/gpl-2.0.html"
        }
    ]
}
,

En utilisant le code HTML:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<script src="libs/jquery-1.10.1.js"></script>
< script >
//When DOM loaded we attach click event to button
$(document).ready(function(){
    //after button is clicked we download the data
    $('.button').click(function(){
        //start ajax request
        $.ajax({
            url:      "data.json",
            //force to handle it as text
            dataType: "text",
            success:  function(data){
                //data downloaded so we call parseJSON function 
                //and pass downloaded data
                var json = $.parseJSON(data);
                //now json variable contains data in json format
                //let's display a few items
                $('#results').html('Plugin name: ' + license[0].type + '<br />Author: ' + license[0].url);
            }
        });
    });
});
</script>

25/03/2014, 14h23
SpaceFrog

Code:

dataType: "text",

tu attends un JSON .... :roll:

y'a la virgule à la finc du json ???
25/03/2014, 16h36
L'aigle de Carthage

Oui, je veux parser ce code JSON :roll:
25/03/2014, 16h59
SpaceFrog

si tu mets dataType JSON plsu besoin de parser ...

et si tu as une virgule à la fin ...
faudra l'enlever si tu veux le parser