Event "onkeyup" - Synchronisation difficile
Bonjour.
Alors c'est assez (voire très) compliqué mais je vais essayer de faire court.
J'ai des champs "input" de type "text" dans ma page. Je souhaite que l'utilisateur puisse taper le contenu de tous les champs au clavier sans discontinuer, i.e. sans appuyer sur TAB pour aller au input suivant et sans cliquer sur le input suivant. Jusque là rien de bien difficile, exemple:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
| <html>
<head>
<script type="text/javascript">
function checkLen(x,y)
{
if (y.length==x.maxLength)
{
var next=x.tabIndex
if (next<document.getElementById("myForm").length)
{
document.getElementById("myForm").elements[next].focus()
}
}
}
</script>
</head>
<body>
<p>This script automatically jumps to the next field when the current field's maxlength has been reached:</p>
<form id="myForm">
<input size="3" tabindex="1" maxlength="3" onkeyup="checkLen(this,this.value)">
<input size="2" tabindex="2" maxlength="2" onkeyup="checkLen(this,this.value)">
<input size="3" tabindex="3" maxlength="3" onkeyup="checkLen(this,this.value)">
</form>
</body>
</html> |
Le problème: considérons les trois champs textes ci dessous:
[champ1] [champ2] [champ3]
Lorsque le champ1 est rempli, mon script saute au champ3... cela se produit lorsque ces 2 conditions sont remplies:
- le champ2 est déjà rempli
- l'utilisateur a tapé le contenu du champ1 un peu vite
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
| // Passage automatique au champ suivant
function autoNextFocus(fromElementId, toElementId)
{
window.event.cancelBubble = true;
window.event.returnValue = false;
if (window.event.repeat) window.event.repeat = false;
// When the key pressed is tabulation ("9") or shift ("16")
// the function must not be executed to allow going
// forward (tabulation) and backward (shift+tabulation)
if (window.event.keyCode!=9 && window.event.keyCode!=16 && window.event.keyCode!=37 && window.event.keyCode!=38 && window.event.keyCode!=39 && window.event.keyCode!=40)
{
fromElement = document.getElementById(fromElementId);
toElement = document.getElementById(toElementId);
currentValue = fromElement.value;
if (currentValue.length==fromElement.maxLength) {
toElement.focus();
}
}
return false;
} |
J'ai cherché des heures et des heures sans succès :cry:
Les "cancelBubble", "returnValue" et "repeat" (en début de script) ne servent à rien dans mon cas, je ne vois plus vers quoi me tourner. J'aurais aimer faire "window.event = null;" en fin de script mais ça n'est pas possible.
Je n'arrive même pas à savoir pourquoi il saute un champ. J'ai remarqué que le focus passait au champ2 avant la détection du dernier onkeyup du champ1. Je ne comprend pas pourquoi, je suis perdu :?
Il y a aussi des appels AJAX à chaque sortie de champ (événement onbeforedeactivate) mais je ne pense pas qu'il y ait un rapport.
Des idées ? Des liens ? Une corde ?
(Je suis sous IE6 only)
