Bonjour, je viens d'écrire un scripte qui fait la recherche d'une chaine tapé par le clavier dans une liste déroulante. Tout marche bien mais il y a un seul probléme est que la recherche donne une plus d'importance au premier lettre c'est à dire :
si j'ai les deux mots "chien" et "etoile"dans la liste et quand je tappe tout le mot "chien" dans ma recherche, à l'instant où j'arrive à la lettre "e" , le pointeur se pointe sur etoile alors je veux qu'il reste sur le mot "chien". J'espére que j'ai bien expliqué mon problème et merci pour vos aides.
le scripte est :
si j'ai les deux mots "chien" et "etoile"dans la liste et quand je tappe tout le mot "chien" dans ma recherche, à l'instant où j'arrive à la lettre "e" , le pointeur se pointe sur etoile alors je veux qu'il reste sur le mot "chien". J'espére que j'ai bien expliqué mon problème et merci pour vos aides.
le scripte est :
<html>
<head>
<title>Liste déroulante éditable</title>
<script language="JavaScript" type="text/javascript">
//Variable globale contenant les chaines frappees (par listbox)
var tb_chaines_rechfrappe = new Array();
// Gestion de la frappe clavier (fonction à mettre sur l'evt onkeyup de la listebox) :
// - select : objet select
// - e : objet event
function capte_rechfrappe(select,e) {
var code = 0;
var car = '';
//Récuperation du code de la touche frappee
if(parseInt(navigator.appVersion) >=4){
if(navigator.appName == 'Netscape'){ // Pour Netscape, firefox, ...
code = e.which;
} else { // pour Internet Explorer
code = e.keyCode;
}
}
//Si la touche est une lettre ou un nombre on incremente la chaine globale et on lance la selection sur la listebox
if((code>=65 && code<=90) || (code>=48 && code<=57)){
car = String.fromCharCode(code);
if ((typeof tb_chaines_rechfrappe[select.name])=='undefined')
tb_chaines_rechfrappe[select.name] = car;
else
tb_chaines_rechfrappe[select.name] += car;
document.getElementsByName('texte')[0].value=tb_chaines_rechfrappe[select.name];
document.getElementsByName('code')[0].value=code;
placeListe_rechfrappe(select);
}
}
//Placement sur la liste :
// - select : objet select
function placeListe_rechfrappe(select) {
var str_chaine = new String(tb_chaines_rechfrappe[select.name]);
var elem_select = false;
//On parcourt toute la liste d'options
for(i=0;i<select.options.length;i++) {
var option_text = select.options[i].text;
var str_option_text = new String(option_text);
str_option_text = str_option_text.toUpperCase();
//Si le debut de la chaine 'text' de l'option correspond a la chaine saisie on selection l'option
if((str_option_text.substr(0,str_chaine.length) == str_chaine) && !elem_select) {
select.options[i].selected=true;
elem_select = true;
}
}
}
//Reinitialisation de la chaine de frappe (fonction à mettre sur l'evt onBlur de la listebox) :
// - select : objet select
function reinit_rechfrappe(select) {
tb_chaines_rechfrappe[select.name] = '';
}
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<form name="form">
<select name='selectbox[truc]' onkeyup='javascript:capte_rechfrappe(this,event);' onBlur='javascript:reinit_rechfrappe(this);'>
<option>maison</option>
<option>miel</option>
<option>mariage</option>
<option>chien</option>
<option>chemin</option>
<option>chat</option>
<option>etoile</option>
</select>
<input type=text name='code'>
<input type=text name='texte'>
</form>
</body>
</html>
