Autocomplete multiple et fill()
Bonjour,
J'ai un problème au sujet de l'autocomplete via jQuery.
J'ai suivi le tutoriel de ce site : http://blog.arnaud-k.fr/2009/04/28/t...jquery-et-php/.
Tout fonctionne parfaitement lorsqu'il n'y a qu'un seul champ sur lequel on veut appliquer l'autocomplete.
Mon problème est lorsqu'il y a deux (ou plus) champs.
Je ne rencontre pas de problème sur la méthode lookup, lorsque j'entre les premières lettres, la liste générée apparaît bien sous le textfield.
Le problème se situe au niveau de la méthode fill().
Le site propose cette méthode quand il n'y a qu'un champ à autocomplete :
Code:
1
2
3
4
5
|
function fill(thisValue) { // remplir le champ texte si une suggestion est cliquée
$('#inputString').val(thisValue);
setTimeout("$('#suggestions').hide();", 200);
} |
Et comme élément HTML correspondant :
Code:
1
2
3
4
5
6
|
<input type="text" size="30" value="" id="inputString" />
<div class="suggestionsBox" id="suggestions" style="display: none;">
<div class="suggestionList" id="autoSuggestionsList"><!-- liste contenant les suggestions --></div>
</div> |
De mon côté j'ai deux champs text :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<input type="text" size="30" value="" id="A" />
<div class="suggestionsBox" id="suggestionsA" style="display: none;">
<div class="suggestionList" id="autoSuggestionsListA"><!-- liste contenant les suggestions A--></div>
</div>
<br><br>
<input type="text" size="30" value="" id="B" />
<div class="suggestionsBox" id="suggestionsB" style="display: none;">
<div class="suggestionList" id="autoSuggestionsListB"><!-- liste contenant les suggestions B--></div>
</div> |
J'ai essayé plusieurs possibilités sur la méthode fill() comme :
Code:
1
2
3
4
5
6
7
8
9
10
11
|
function fill(thisValue) {
if (document.getElementbyId('A').value != null) {
$('#inputStringA').val(thisValue);
setTimeout("$('#suggestionsA').hide();", 200);
}
else if (document.getElementbyId('B').value != null) {
$('#inputStringB').val(thisValue);
setTimeout("$('#suggestionsB').hide();", 200);
}
} |
Mais ça ne marche pas...
J'ai essayé de créer deux méthodes du genre :
Code:
1
2
3
4
5
6
7
8
9
10
|
function fill(thisValue) {
$('#inputStringA').val(thisValue);
setTimeout("$('#suggestionsA').hide();", 200);
}
function fill2(thisValue) {
$('#inputStringB').val(thisValue);
setTimeout("$('#suggestionsB').hide();", 200);
} |
En appelant bien sûr fill2() sur le onblur du textField B.
Mais fill2() n'est pas appelé.
Si quelqu'un a une idée je suis preneur car je tourne en rond depuis quelques jours jours...
Merci.
