[jQuery] Formulaire : auto complétion et ajout/suppression de champs
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:
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:
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:
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 ?
