Discussion :

[Foxhoound]

Bonjour,

J'ai réussi à mettre en place un système d'auto complétion sur un champ (à l'aide du plugin autocomplete). En gros, j'ai pour l'instant :

Code :

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

1
2
3
 
<input type="text" name="ville_1" id="ville_1" /> 
<input type="hidden" name="ville_id_1" id="ville_id_1" />

(l'input hidden sert à stocker l'id associé à la ville)

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
 
$('#ville_1').autocomplete("get_ville_list.php", {
	//width: 155,
	selectFirst: true,		 
	autoFill: false,
	matchContains: true,
	min: 3,
	max: 120,  				  
	formatItem: function(data, i, n, value) {   
		return  data[0];
	} 
   }).result(function(event, data, formatted) { 
     var hidden = $("#ville_id_1");
     hidden.val(data[1]);
});

Ca marche bien dans l'état actuel sauf que j'aimerais rajouter une fonctionnalité permettant de rajouter dynamiquement des champs. En somme, si l'utilisateur souhaite ajouter un nouveau champ de recherche, on aurait quelque chose comme ça :

Code :

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

1
2
3
4
5
 
<input type="text" name="ville_1" id="ville_1" /> 
<input type="hidden" name="ville_id_1" id="ville_id_1" />
<input type="text" name="ville_2" id="ville_2" /> 
<input type="hidden" name="ville_id_2" id="ville_id_2" />

Sauf que le "$('#ville_1').autocomplete" et "var hidden = $("#ville_id_1");" font que l'auto complétion ne marche que sur le premier champ...

Donc, comment faire pour le l'auto complétion marche sur tous les champs et que le champ hidden du champ i soit mis à jour quand le champ i est renseigné ?

Avez-vous une idée pour résoudre ce problème ?

[Foxhoound]

Problème réglé. Tout bêtement :

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
function add_autocomplete(nb) {
    $('#ville_'+nb).autocomplete("get_ville_list.php", {
        //width: 155,
        selectFirst: true,		 
        autoFill: false,
        matchContains: true,
        min: 3,
        max: 120,  				  
        formatItem: function(data, i, n, value) {   
            return  data[0];
        } 
       }).result(function(event, data, formatted) { 
         var hidden = $("#ville_id_"+nb);
         hidden.val(data[1]);
    });
}

(faudrait peut-être que j'apprenne et pratique vraiment le JavaScript un jour, ça m'éviterai ce genre de situations si mon bout de code peut aidé quelqu'un...)