champ date réparti sur 3 zones - autotab

**jcaruana** · 04/04/2006, 10h54

bonjour,

mon problème est assez simple, mais j'ai vraiment du mal avec le js.

Je travaille sur une appli web dans laquelle on trouve des champs date répartis dans trois zones de texte (des input) : jour/mois/année.

Je voudrais pouvoir passer d'un champ à un autre sans utiliser la touche <tab> lorque la case est remplie. Ainsi, si on rentre 2 caractères pour la case "jour" (le controle se fait à postérieuri par Struts), on passe à la case suivante "mois" automatiquement.

**jcaruana** · 04/04/2006, 11h34

après longues investigations sur le net, je trouve ce qui me semble etre le + approchant : http://www.mattkruse.com/javascript/autotab/

Mais chez moi, ce la ne fonctionne pas, je dois mal l'utiliser :

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><title>Test auto tab en javascript</title></head>
<body>
<SCRIPT LANGUAGE="JavaScript" SRC="./autotab.js"></SCRIPT>
  <table>
   <tr>
    <td> Date de naissance : &nbsp;
     <input type="text" name="jourNaiss" maxlength="2" size="1" value=""
     	style="width:25px;" class=""
     	onKeyDown="TabNext(this,'down',2)" onKeyUp="TabNext(this,'up',2,this.form.moisNaiss)" >
 
     <input type="text" name="moisNaiss" maxlength="2" size="1" value=""
     	style="width:25px;" class=""
     	onKeyDown="TabNext(this,'down',2)" onKeyUp="TabNext(this,'up',2,this.form.anneeNaiss)" >
 
     <input type="text" name="anneeNaiss" maxlength="4" size="2" value=""
     	style="width:40px;" class="">
 
    </td>
  </table>
 
</body>
</html>

et le js associé :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
var my_field_length=0;
function TabNext(obj,event,len,next_field) {
	if (event == "down") {
		my_field_length=obj.value.length;
		}
	else if (event == "up") {
		if (obj.value.length != my_field_length) {
			my_field_length=obj.value.length;
			if (my_field_length == len) {
				next_field.focus();
				}
			}
		}
	}

j'ai systématiquement des erreurs sur les évènements onKeyDown et onKeyUp .

Code :

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

1
2
3
4
5
ligne :10
car : 1
Erreur : objet requis
Code : 0
url : mon_fichier.html

comment résoudre ce problème ?
ps : c'est IE 5.5

**SpaceFrog** · 04/04/2006, 11h43

c'est dans la

**jcaruana** · 04/04/2006, 11h52

Envoyé par SpaceFrog

c'est dans la

c'est ce que je pensais, mais je n'ai rien trouvé de précis au bout de 15 min de recherche, sauf http://javascript.developpez.com/faq...her#FocusObjet qui ne répond pas à la question pour un débutant comme moi en js (et qui compte le rester...)

j'ai finalement essayé http://www.rgagnon.com/jsdetails/js-0113.html et ca marche superbement et détecte en outre la taille sans à avoir à la passer en argument (ce qui est pratique)
[/url]

champ date réparti sur 3 zones - autotab

JavaScript

Discussions similaires

Partager

Partager