Discussion :

[Pifon]

Bonjour à tous,

Je rencontre un petit souci avec l'autocompletion de jquery ui.
J'envoi une requête ajax à un web service et récupère une réponse json qui est utilisée pour pour l'autocompletion dans un input 'recherche'.

Voici mon 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
$('#recherche').autocomplete({ 
	minLength : 2,
 
	source : function(requete, reponse){ // les deux arguments représentent les données nécessaires au plugin
	$.ajax({
		url : 'http://xxxxxxxxxxxxxx/webservices/ws_json_villes.php?',
		type : 'GET',
		dataType : 'json',
		data : 'first_letters='+lettre+'&full',
 
		success : function(donnee){
			reponse($.map(donnee, function(objet){
				return objet.ville_nom_reel; // on retourne cette forme de suggestion
			}));
		}
	});
}});

Mon problème est que je reçois bien une réponse mais lorsque je saisi une chaîne dans mon input j'ai la totalité du json qui s'affiche dans les suggestions. En gros l'autocompletion ne fonctionne pas. Je voudrais que quand je saisie par exemple 'fr' j'ai dans mes suggestions uniquement les mots commençant par 'fr'.

Quelqu'un a déjà été confronté à ce problème ?

D'avance merci.

[danielhagnoul]

Bonsoir

Je vous conseille de prendre exemple sur le code source de cette démonstration http://jqueryui.com/autocomplete/#remote-jsonp

Extrait :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
source: function( request, response ) {
    $.ajax({
        url: "http://gd.geobytes.com/AutoCompleteCity",
        dataType: "jsonp",
        data: {
            q: request.term
        },
        success: function( data ) {
            response( data );
        }
    });
},

[Pifon]

Merci pour votre conseil .
j'avais deja consulté cette page mais je n'ai pas reussi a
m'en servir. Dès que je placais des {} dans mon champ data ca ne fonctionnait plus.

[danielhagnoul]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

data : 'first_letters=' + request.term + '&full',

[Pifon]

Problème résolu !

Je suis un immense boulet... Le web service ne fonctionne pas qu'avec une seul lettre mes plusieurs (d'où le 'first_letterS'...)
Donc je passe en paramètre ce que j'ai saisi au clavier avec : $('#recherche').val().

Voici mon code (qui fonctionne) :

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
 
$('#recherche').autocomplete({ 			
	source : function(requete,reponse){ // les deux arguments représentent les données nécessaires au plugin
	$.ajax({
		url : 'http://www.cyril-minette.net/iut/javascript/webservices/ws_json_villes.php',
		type : 'GET',
		dataType : 'json',
		data :'first_letters='+$('#recherche').val()+'&full',
 
		success : function(donnee){
			reponse($.map(donnee, function(objet){
				return objet.ville_nom_reel; // on retourne cette forme de suggestion
			}));
		}
	});
}});

J'ai essayé avec requete.term et ça fonctionne également.

Merci beaucoup danielhagnoul pour votre aide précieuse !