champs et tabulations

**Sanvean** · 08/10/2009, 20h34

Bonsoir,

Un petit problème que je n'ai pas réussi à résoudre cet après-midi.

Je cherche à faire en sorte que l'utilisateur ne soit pas obligé d'utiliser la tabulation ou sa souris pour remplir les 3 champs d'une date (jour, mois, année). J'ai donc prévu une fonction pour que le focus change dès que 2 caractères sont entrés dans le champ.

Seulement voilà, je souhaiterais également que dans le cas où l'utilisateur souhaite apporter une modification à ses valeurs (sans tout effacer), ce système soit capable de modifier certaines valeurs seulement, en les sélectionnant.

Voici ce que j'ai pour le moment :

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
24
<html>
<head>
</head>
<body>
<script language="Javascript">
function ChampSuivant(actuel, suivant, limite)
{
	if (actuel.value.length == limite) 
	{
			suivant.focus();
	}
}
</script>
<form name="form">
<input type="text" name="champ1" size=2 maxlength=2 onKeyUp="ChampSuivant(champ1,champ2,2)"> / 
<input type="text" name="champ2" size=2 maxlength=2 onKeyUp="ChampSuivant(champ2,champ3,2)"> / 
<input type="text" name="champ3" size=2 maxlength=2 onKeyUp="ChampSuivant(champ3,champ4,2)">
<br/>
<input type="text" name="champ4" size=2 maxlength=2 onKeyUp="ChampSuivant(champ4,champ5,2)"> / 
<input type="text" name="champ5" size=2 maxlength=2 onKeyUp="ChampSuivant(champ5,champ6,2)"> / 
<input type="text" name="champ6" size=2 maxlength=2>
</form>
</body>
</html>

Essayez de remplir les champs, et revenez dans le premier champ pour apporter des modifications : le focus "saute" le champ suivant et se place un champ trop loin.

Quelqu'un saurait-il m'indiquer ce que je fais de mal ? Je ne vois pas la logique qui fait que le focus aille trop loin dans ce cas.

Merci !

**SpaceFrog** · 08/10/2009, 20h57

voir FAQ ou contributions j'y ai proposé un script il y a quelques années ...

[€dit] FAQ
http://javascript.developpez.com/faq...js#TexteSuivat

**Sanvean** · 08/10/2009, 22h29

Merci !

J'ai remplacé focus() par select() pour pouvoir remplacer plus facilement les valeurs.

**Sanvean** · 08/10/2009, 23h34

Mmmhhh...

J'ai le même phénomène avec le code suivant :

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
<html>
<head>
</head>
<body>
<script language="Javascript">
function Autotab(box, longueur, texte)
{
    if (texte.length > longueur-1) {
        document.getElementById('TB'+box).select();
    }
}
</script>
<form name="form">
<input type="text" name="TB1" id="TB1" size=2 maxlength=2 onKeyUp="Autotab(2, this.size, this.value)"> / 
<input type="text" name="TB2" id="TB2" size=2 maxlength=2 onKeyUp="Autotab(3, this.size, this.value)"> / 
<input type="text" name="TB3" id="TB3" size=2 maxlength=2 onKeyUp="Autotab(4, this.size, this.value)">
<br/>
<input type="text" name="TB4" id="TB4" size=2 maxlength=2 onKeyUp="Autotab(5, this.size, this.value)"> / 
<input type="text" name="TB5" id="TB5" size=2 maxlength=2 onKeyUp="Autotab(6, this.size, this.value)"> / 
<input type="text" name="TB6" id="TB6" size=2 maxlength=2>
</form>
</body>
</html>

Je ne vois pas ce qui cloche... les tabindex ? Dans l'exemple proposé, ce n'est pas 1/2/3 mais 1/3/2... est-ce là mon erreur ? Si oui, j'ai du mal à comprendre le sens du tabindex "mélangé".

EDIT : j'ai trouvé la solution, que j'ai postée dans un sujet similaire au mien : http://www.developpez.net/forums/d16...ion-difficile/

champs et tabulations

JavaScript

Discussions similaires

Partager

Partager