Discussion :

[booraq]

Bonjour à tous ;-)
voilà je viens de commencer un code pour un instant search sur un fichier json, ça a l'ai de tourner (je note que je ne suis pas du tout un AS du javascript en général) bref, le code tourne, MAIS, mon keyup(...) ne me modifie pas la recherche (comme le cas à travers php, mysql) au fûr et à mesure que je tape plus de 3 lettres (que j'ai fixé pour démarrer la recherche).
j'espère que vous avez compris la question hah.
j'expose de suite le code en question...

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
$(document).ready(function(){
 $('#results').ajaxStart(function(){
  $(this).html("<img src='loading.gif' />");		   
 }).ajaxStop(function(){      
   $(this).html('');	  
});
 
$("input#fieldSearch").keyup(function(e){ 
 var query = $("input#fieldSearch").val();
  $.getJSON('moteur.json', function(json) { 
   $("#results").append("<p>Results for <b>" + query + "</b></p>");
   $.each(json,function(i, value){
   if(query !== '' && query.length >= 3){   
    if(value.nom.match(query))
       $('#results').append('<p>'+'<a href="'+value.adresse+'">'+value.nom+'</a><br><SPAN class=vert>'+value.adresse+'</span><br>'+value.description+'</p>'); 
    }	   
	else  $('#results').html('');            		
	});//each()      
  });//getJSON()
});//keyup()
 
//clic sur la croix efface l'ecran
function efface() {
    var x = document.getElementById("fieldSearch");
    document.getElementById("results").innerHTML = "";
}
document.getElementById("fieldSearch").addEventListener("search", efface);
});//document()

alors comment pourrai-je remédier à celà et y a t-ils quelconques améliorations
MERCI

[mathieu]

regardez le moniteur réseau de votre navigateur pour voir si les requêtes AJAX se passent comme prévu
par exemple avec Firefox cela se passe là :
https://developer.mozilla.org/fr/doc...ur_r%C3%A9seau

[booraq]

je ne pense pas que ça vienne de là mon problème :-/, ça vient sûrement de mon code, il n'est pas parfait
ajax fonctionne bien javascript aussi et jquey.
A+

[booraq]

Rebonjour ;c'est encore moi, j'ai résolu le problème précédent, il reste tout de même un petit HIC...
Après une recherche et quand je supprime le mot-clef dans la case de saisie, les anciens résultats restent malheureusement affichés.
alors question: comment faire pour qu'ils disparaissent dans ces cas?
Merci beaucoup pour votre aide à tous
voici le nouveau code:

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
$('#search').keyup(function(){
  var searchField = $('#search').val();     
  var expression = new RegExp(searchField, "i");    
  $.getJSON('moteur.json', function(data) {
  $("#result").empty();
  $("#result").append("<p>Results for <b>" + searchField + "</b></p>");
   $.each(data.donnees, function(key, value){
    if (value.nom.search(expression) != -1 || value.description.search(expression) != -1)    
     $('#result').append('<li class="list-group-item link-class">'+value.nom+' | <span class="text-muted">'+value.description+'</span></li>');    
   });//each()   
  });//getJSON()   
 });//keyup()
 
 //click sur un item 
 $('#result').on('click', 'li', function() {
  var click_text = $(this).text().split('|');
  $('#search').val($.trim(click_text[0]));  
 });
 
//clic sur la croix efface l'ecran
function efface() {
    var x = document.getElementById("search");
    document.getElementById("result").innerHTML = "";
}
document.getElementById("search").addEventListener("search", efface);