Discussion :

[HiRoN]

Bonjour,

Dans le cadre d'un formulaire que je dois faire pour ma société, j'ai crée un input text qui doit contenir des numéros de téléphones portables.

Code :

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

<input type="text" id="tel" name="tel" value="06">

Lorsque le focus arrive sur le champ, il "sélectionne" le 06, ce qui oblige l'utilisateur à retaper "06" + la suite de son numéro.

Y a t-il un moyen de placer directement le focus après le "06" ?
De façon à ce que l'utilisateur tape directement le numéro sans avoir à retaper "06" au début...

[SpaceFrog]

Code :

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

onfocus="this.value=this.value"

ha non désolé ça ça fait l'inverse ^^

[marts]

Code :

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

1
2
 
<input type="text" value="06" onfocus="this.selectionStart=2;">

[SpaceFrog]

Curieusment cela n'a pas l'air de fonctionner lorsque le champs reçoit le focus au moyen des tabulations ...

[Jumano]

Bonsoir,
Peut-être une autre solution:

Code :

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

1
2
3
4
5
6
7
8
9
10
 
<form name="form">
<div>
Indiquer votre N&deg; de portable : 
<input name="Tph1" id="Tph1" type="text" value="06" size="1" maxlength="2" onFocus="this.blur(); document.form.Tph2.focus();" style="text-align:center">
. <input name="Tph2" type="text" id="Tph2" size="1" maxlength="2" style="text-align:center">
. <input name="Tph3" type="text" id="Tph3" size="1" maxlength="2" style="text-align:center">
. <input name="Tph4" type="text" id="Tph4" size="1" maxlength="2" style="text-align:center">
. <input name="Tph5" type="text" id="Tph5" size="1" maxlength="2" style="text-align:center">
</form>

Ce qui te donne plusieurs champs TEXT dont le premier n'est pas modifiable.
Tu as juste ensuite à concaténer tes cinq champs pour obtenir ton numéro de téléphone portable.

Tu peux même si tu le veux agrémenter ce petit petit formulaire de l'excellent script réaliser par SpaceFrog : Comment passer automatiquement au champs suivant lorsque la taille maximale du champs en cours est atteinte ? http://javascript.developpez.com/faq...js#TexteSuivat

[marts]

Apparemment le onfocus s'exécuterait avant la méthode native focus() du champ texte. C'est pour ça que ça ne marche pas, focus() resélectionne tout dès que onfocus est terminé.
Ta solution est une bonne idée jumano.
Car pour ne garder qu'un seul champ, il faudrait recréer de toute pièce un controle texte : une div dans laquelle un curseur clignote et dont le contenu est mis à jour selon les évènements claviers et souris détectés ... un peu compliqué !
Ou pourquoi pas, tout simplement :

Code :

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

1
2
 
06<input type="text" maxlength="8" ...

[HiRoN]

Merci à tous pour vos réponses rapides.

Bien que la solution de Jumano parait la plus sympathique pour réaliser ceci, ça ne correspond pas vraiment à ce que je voudrais.

N'y-a-t-il aucun moyen via JS (par exemple) de réaliser ceci ?
Lors du de la prise du focus sur le champ, positionner le curseur après le 2ème caractère ?

P.S : Je dois appliquer ensuite la même chose pour un champ IMEI (N° de série de tel portable qui doit lui commencer par 35)

[Cornholio]

Voila pour le focus :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
<script>
function focusMoi(element){
	var focussisation = element.createTextRange();	
 
	focussisation.moveStart("character", 2);
	focussisation.select();
}
</script>
 
<input type="text" id="tel" name="tel" value="06" onfocus="focusMoi(this);">

Sur IE 6 ca marche.
Par contre sur FireFox ca marche pas , mais ca peut peut être t'aider.

[madevilts]

J'ai lu quelquepart que selectionStart ne marche que sous FF.

[HiRoN]

Merci T.Cornholio, je vais tenter d'explorer cette piste.

Madevilts > Si selectionStart ne marche que sous FF, alors dans ce cas faire 2 scripts qui s'active ou non en fonction du navigateur utilisé.
Si tu as plus de précisions ou un bout de code pour un script tournat sous FF, je suis preneur.

[madevilts]

Merci T.Cornholio, je vais tenter d'explorer cette piste.

Madevilts > Si selectionStart ne marche que sous FF, alors dans ce cas faire 2 scripts qui s'active ou non en fonction du navigateur utilisé.
Si tu as plus de précisions ou un bout de code pour un script tournat sous FF, je suis preneur.

Malheureusement je ne connais pas cette fonctionalité. En cherchant un peu j'ai lu que selectionStart ne tournait que sur FF et que sur IE il fallait utiliser TextRange. J'ai du interrompre mes recherches car je suis au travail.

[HiRoN]

Ok, ok.
Merci encore pour tes réponses et bonne continuation.

[HiRoN]

Le code fourni par Cornholio ne fonctionne que sous Internet Explorer :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
<script>
function focusMoi(element){
	var focussisation = element.createTextRange();	
 
	focussisation.moveStart("character", 2);
	focussisation.select();
}
</script>
 
<input type="text" id="tel" name="tel" value="06" onfocus="focusMoi(this);">

Malgré plusieurs recherches sur "selectionStart" afin de trouver un équivalent fonctionnant sous Firefox (+ Safari si possible), je n'ai pas réussi à trouver mon bonheur...

Si quelqu'un à déjà planché sur le problème, un bout de code serait le bienvenu.

Cordialement,