nicotontige
-
28 sept. 2012 à 11:19
cs_jperre
Messages postés268Date d'inscriptionlundi 9 janvier 2006StatutMembreDernière intervention19 janvier 2017
-
1 nov. 2012 à 17:13
Bonjour les gens,
J'ai actuellement un code qui me permet de faire un select en ajax (XML) qui fonctionne très bien, si ce n'est que lorsque je navigue dans le menu avec les flèches directionnelles et que j'appuie sur la touche entrée, cela ne valide pas mon choix. Contrairement au clic souris qui lui fonctionne à merveille.
C'est un peu embêtant
Je vous laisse la partie intéressante du code :
//Fonction gérant le parcours des éléments à l'aide des touches directionnelles
selectSuggest = function(direction){
//On regarde si un élément est selectionné
var selected = -1;
var lis = suggestsList.getElementsByTagName('li');
for(i=0; i<lis.length; i++){
if(lis[i].id == 'selectedSuggest'){
selected = i;
}
lis[i].id = '';
}
selected += direction;
selected = (selected < -1 ? (lis.length-1) : selected);
if(selected >= 0 && selected < lis.length){
lis[selected].id = 'selectedSuggest';
}
};
document.body.onkeyup = function(e){
var key = (!is_ie ? e.keyCode : window.event.keyCode);
switch(key){
case 27: //Esc
closeSuggest();
break;
case 9: //Tab
//useSelected();
closeSuggest(true); //On referme la liste sans redonner le focus au champ
break;
case 38: //Up
selectSuggest(-1);
break
case 40: //Down
selectSuggest(1);
break;
case 13: //Enter
useSelected();
break;
}
};
//Remplit le champ avec la suggestion sélectionnée
useSelected = function(){
//On regarde si un élément est selectionné
var lis = suggestsList.getElementsByTagName('li');
for(i=0; i<lis.length; i++){
if(lis[i].id == 'selectedSuggest'){
element.value = lis[i].firstChild.innerHTML;
}
}
closeSuggest(true);
};
document.body.onclick = function(){
closeSuggest(true);
};
//Fonction servant à cacher les suggestions
closeSuggest = function(nofocus){
var todelete = document.createElement('div');
todelete.appendChild(suggestsList);
if(!nofocus){
element.focus();
}
};
Malheureusement ta réponse revient à la même que proposé par jperre.
De plus je ne peux faire une fonction seule de la sorte, vu que je traite aussi les touches ESC, TAB, UP, DOWN.
j'ai donc essayé :
document.body.onkeydown = function(e){
var key = (!is_ie ? e.keyCode : window.event.keyCode);
switch(key){
case 27: //Esc
closeSuggest();
break;
case 9: //Tab
//useSelected();
closeSuggest(true);
break;
case 38: //Up
selectSuggest(-1);
break
case 40: //Down
selectSuggest(1);
break;
case 13: //Enter
closeSuggest(true);
break;
}
};
Mais rien n'y fait .
La sélection a bien lieu (la valeur dans la liste déroulante à bien été choisis), mais les informations qui devrait être remplis dans d'autres input n'apparaissent pas.
Vous n’avez pas trouvé la réponse que vous recherchez ?
cs_jperre
Messages postés268Date d'inscriptionlundi 9 janvier 2006StatutMembreDernière intervention19 janvier 20172 1 nov. 2012 à 17:10
Je crois avoir trouvé la réponse à votre problème. Il existe une nouvelle propriété de l'objet event qui s'applique à tous les navigateurs sauf IE 8 et les versions antérieures. Cette propriété s'appelle la propriété which Le code suivant devrait fonctionner :
document.body.onkeyup = function(e){
var x;
if (e==window.event) { //IE8 et versions antérieures
x=e.keyCode;
}
else if {e.which) { //IE8 - Firefox - Chrome - Opera - Safari
x=e.which
}
switch(x){
case 27: //Esc
closeSuggest();
break;
case 9: //Tab
//useSelected();
closeSuggest(true); //On referme la liste sans redonner le focus au champ
break;
case 38: //Up
selectSuggest(-1);
break
case 40: //Down
selectSuggest(1);
break;
case 13: //Enter
useSelected();
break;
}
};
cs_jperre
Messages postés268Date d'inscriptionlundi 9 janvier 2006StatutMembreDernière intervention19 janvier 20172 1 nov. 2012 à 17:13
Erratum: Dans le commentaire de la ligne :
else if {e.which) { //IE8 - Firefox - Chrome - Opera - Safari
il faut lire :
else if {e.which) { //IE9 - Firefox - Chrome - Opera - Safari