Utilisation d'un fichier json pour une recherche

Version imprimable

Bonjour ,

je travail sur une application web et j'ai voulus mettre en place un fichier json contenant des données pour pouvoir mettre en place un barre de recherche mais étant novice en js (jquery/ajax) je ne sais pas du tout comment récupéré les données que je viens de crée dans mon fichier JSON ci dessous.
Code:

1 2 3 4 5 6 7 8 {"utilisateur":[ {"email":"toto@toto.com","mdp":"toto"}, {"email":"titi@titi.com","mdp" :"titi"} ]} {"produit":[ {"nom":"doliprane_400mg","prix":"3","valide":"true"}, {"nom":"doliprane_50mg","prix":"2","valide":"true"} ]}
j'aimerai donc pouvoir récupérer le nom de mes produits dans un fichier js pour pouvoir les comparer avec la saisie effectuer d'un utilisateur grace au form type "search"
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 !-- formulaire qui contient la barre de recherche d'un produit --> <div class="frmSearch"> <form class="row"> <h4>Chercher un produit :</h4> <input id="text" type="search" name="searchB" value="" placeholder="entrer le nom d'un Produit"> <input type="button" name="btnCherche" value="chercher" onclick="affRef()"> </form> </div>  <script type="text/javascript"> </script>
Merci d'avance pour votre aide ! :)

Un exemple.

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
 
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script>
function recherche(valeur) {
 var data_json;
 $.ajax({
  url : "test9280.json",
  async: false,
  type: "get",
  data : {r:Math.random()},
  dataType: 'json'
 }).done(function(html) {data_json= html;}); 
 var toto = data_json['produit'];
 for (var i=0;i<toto.length;i++) {
  if (toto[i].nom == valeur) {
   alert(valeur + ' trouvée. Prix = '+toto[i].prix);
   return;
  }
 }
 alert('Rien trouvé');
 return;
}
</script>
</head>
<body>
<script>
recherche('aspirine_500mg');
recherche('doliprane_1000mg');
</script>
</body>
</html>

test9280.json

Code:

1
2
3
4
5
6
7
8
9
10
11
12
 
{
  "utilisateur":[
  {"email":"toto@toto.com","mdp":"toto"},
  {"email":"titi@titi.com","mdp" :"titi"}
  ],
  "produit":[
  {"nom":"doliprane_400mg","prix":"3","valide":"true"},
  {"nom":"aspirine_500mg","prix":"7","valide":"true"},  
  {"nom":"doliprane_50mg","prix":"2","valide":"true"}
  ]
}

01/06/2017, 08h53
Jaimee

merci beaucoup de ton aide je vais tester cela dans la journée !