Tabulation automatique

ViPHP
ViPHP | 2291 Messages

19 sept. 2006, 17:27

Bonjour,

J'ai une bête question mais à laquelle je ne trouve pas de réponse :lol:
J'ai dans un formulaire une section adresse MAC avec 6 input qui n'autorise que 2 caractères dans chaque input, et je voudrais savoir comment faire pour que la tabulation se fasse automatiquement une fois les deux caractères taper :?:

En html, php, ou javascript peu m'importe :!:

D'avance merci
ImageCe que l'on apprend par l'effort reste toujours ancré beaucoup plus longtemps.

Avatar du membre
Administrateur PHPfrance
Administrateur PHPfrance | 9782 Messages

19 sept. 2006, 17:47

Bonjour,

Le langage à utiliser est le javascript vu que ça doit se passer côté client (=sans recharger la page)


Voici le principe :

Sur l'évènement onchange() de ton input, mettre une fonction qui calcule le nombre de caractères qui sont dedans (ça se fait très bien avec this.value.length)
Si le résultat est >=2 alors il faut que tu donnes le focus au champ suivant, ce qui se fait avec la méthode focus()
Quand tout le reste a échoué, lisez le mode d'emploi...

ViPHP
ViPHP | 2291 Messages

19 sept. 2006, 21:06

Bonjour,

Le langage à utiliser est le javascript vu que ça doit se passer côté client (=sans recharger la page)


Voici le principe :

Sur l'évènement onchange() de ton input, mettre une fonction qui calcule le nombre de caractères qui sont dedans (ça se fait très bien avec this.value.length)
Si le résultat est >=2 alors il faut que tu donnes le focus au champ suivant, ce qui se fait avec la méthode focus()

Salut,

Merci pour cette réponse voici ma solution

Code : Tout sélectionner

function checkFilling(field, next) { if (next) { if (field.value.length==field.maxLength) { field.form.elements[next].focus(); } } }
Et le FORM
<input type="text" name="mac[1]" size="2" maxlength="2" style="text-transform: uppercase" id="mac1" tabindex="1" onKeyUp="checkFilling (this,'mac2')">:<input type="text" name="mac[2]" size="2" maxlength="2" style="text-transform: uppercase" id="mac2" tabindex="2" onKeyUp="checkFilling (this,'mac3')">:<input type="text" name="mac[3]" size="2" maxlength="2" style="text-transform: uppercase" id="mac3" tabindex="3" onKeyUp="checkFilling (this,'mac4')">:<input type="text" name="mac[4]" size="2" maxlength="2" style="text-transform: uppercase" id="mac4" tabindex="4" onKeyUp="checkFilling (this,'mac5')">:<input type="text" name="mac[5]" size="2" maxlength="2" style="text-transform: uppercase" id="mac5" tabindex="5" onKeyUp="checkFilling (this,'mac6')">:<input type="text" name="mac[6]" size="2" maxlength="2" style="text-transform: uppercase" id="mac6" tabindex="6"></td>
Merci
ImageCe que l'on apprend par l'effort reste toujours ancré beaucoup plus longtemps.