Discussion :

[TCHdvlp]

Bonjour à tous.

J'utilise le widget Jqueryui 'autocomplete' pour afficher sur ma page un champs de recherche à la manière de google.

Jusqu'ici, du classique, seulement je me trouve face à un problème sous IE (n'importe quelle version)

Quand je commence à saisir des caractères, la liste se remplie. Si je descend avec les flèches du clavier et que je tape Entrée sur la ligne voulue, tout fonctionne impeccable. Mais si je clique sur la ligne souhaitée, les actions sont bien réalisées puisque mes autres champs de la page réagissent, mais le champ autocomplete lui même se vide.

J'ai passé pas mal de temps à chercher une solution sans succès =/
Tout ce que j'ai pu trouver, c'est que sur un clique souris, dans l'évenement 'event' event.relatedTarget est à null lorsqu'il s'agit d'un clic souris. C'est la seule difference que je note par rapport à la sélection au clavier.

html:

Code :

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

<input type="text" id="suggestVehicule" value="Entrez un code " size="100" class="textfield" width="auto" onfocus="javascript:this.value=''" autocomplete="off />

et le javascript :

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
$( "#suggestVehicule" ).autocomplete({
source: function( request, response ) {
  	$.getJSON("/.../.../.../vehicules/FiltrerVehiculeAction.do",
  	{ q: request.term },
  	function(data) {
  	response( $.map( data, function(item ) {
  	return {
  		label:item.designationComplete,
  		value:item.designationComplete,
  		codeV:item.codeVehicule
  	}
        }));			
        });
},
minLength: 2,
width: 400,
dataType: 'json',
select:function(event, ui){
        $("#leVehicule").val(ui.item.codeV);
	return true;
	}
 
});

la partie intéressante se situe au niveau du select:
J'ai essayé d'utilisé le focus, close, change... Rien n'y fait. Pourtant, le champ "leVehicule" réagit bien au choix de la ligne même sous IE

Merci d'avance pour votre aide les developpeziens.

[TCHdvlp]

J'ai résolu en partie mon problème
C'était tout bête en fait, quand on clique sur un élément de la liste, l’évènement 'focus' est déclenché. Du coup, ça effaçait le texte comme lors du premier click dans le champ.

J'ai viré le

Code :

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

onfocus="javascript:this.value=''"

mais le soucis maintenant c'est que l'utilisateur doit préalablement effacer le texte du champ avant de rentrer son texte. =/

edit :
Bien tout simplement, j'ai bindé l'évènement focus sur une fonction qui n'efface le texte que si celui ci vaut la valeur par défaut (Entrez une valeur...)