Remplissage dynamique champ email

**killingspree** · 26/02/2008, 10h47

Bonjour à tous,

Donc mon souhait est de permettre de préremplir le champ email d'un formulaire en fonction du nom et prenom que l'on aura saisi. Un email de la sorte : prenom.nom@domaine.com

j'imagine qu'il faudra utiliser un élément onchange sur les champs textes ou quelque chose dans ce style mais je suis débutant en javascript si vous pouviez me guider.

Merci par avance.

**SpaceFrog** · 26/02/2008, 14h41

le domaine est toujours le même ?

**killingspree** · 26/02/2008, 14h55

Oui le domaine est toujours le même Spacefrog.

**SpaceFrog** · 26/02/2008, 15h01

Code :

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

1
2
3
4
5
6
<input id="email" type='text' style="width:300px;" />
<script type='text/javascript'>
var surName= prompt('entrez votre prénom','prénom');
var firstName= prompt('entrez votre Nom','Nom');
document.getElementById('email').value=surName+"."+firstName+"@domaine.fr"
</script>

**killingspree** · 26/02/2008, 15h17

Merci a toi Spacefrog, cela fonctionne mais ce n'est pas tout à fait ce que je voulais dire, je me suis peut-être mal exprimé.
J'ai déjà des champs de type "text" dans lesquels l'utilisateur renseigne son nom et son prénom et donc ce que je voudrais c'est qu'après avoir renseigné ses nom et prénom, le champ email se remplisse tout seul.

J'espère avoir été plus clair.

Merci par avance.

**SpaceFrog** · 26/02/2008, 15h24

ben tu pourrais partir du code donné et l'adapter ...

**SpaceFrog** · 26/02/2008, 15h29

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
<script type='text/javascript'>
function completeMail(){
var pren= document.getElementById('prenom').value
var nom= document.getElementById('nom').value;
if (pren.length>1 && nom.length>2){
		document.getElementById('email').value=pren+'.'+nom+'@domaine.fr';
		}
}
</script>
</head>
 
<body>
premon: <input id="prenom" type='text' style="width:100px;" onchange="completeMail();"/>
nom: <input id="nom" type='text' style="width:100px;" onchange="completeMail();" /><br />
email:
<input id="email" type='text' style="width:300px;" />
 
</body>

**killingspree** · 26/02/2008, 15h49

Merci bien Spacefrog, cela fonctionne parfaitement. J'ai essayé de l'adapter au depart mais cela se remplissait uniquement lorsque l'on cliquait sur le champ email maintenant c'est impeccable.

Merci encore et à bientôt.

**killingspree** · 26/02/2008, 16h03

En fait j'ai un nouveau soucis. Cela ne marche pas sous firefox, uniquement sous IE, et l'application risque d'être utilisée principalement sur Firefox.
Y a-t-il la possibilité d'adapter ce code pour qu'il fonctionne sous les deux ?

Merci par avance.

**SpaceFrog** · 26/02/2008, 16h08

je n'ai aucun souci sous FFX ça focntionne tout aussi bien ???

fais voir ton code ?

**killingspree** · 26/02/2008, 16h13

Voici mon code :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
	function completeMail()
	{
		var pren= document.getElementById('prenomAgent').value;
		var nom= document.getElementById('nomAgent').value;
		pren = pren.toLowerCase();
		nom = nom.toLowerCase();
		if (pren.length>1 && nom.length>2)
		{
			document.getElementById('emailAgent').value=pren+'.'+nom+'@highdeal.com';
		}
	}

et dans les input

Code :

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

onchange="javascript:completeMail()"

Mon appli est sur un serveur distant. Lorsque j'y accède à partir de Firefox il ne se passe rien quand je remplis les champs et quand j'y accède à partir d'IE, cela marche ....

Et dans outils>options>contenu(de firefox) la case Activer javascript est bien cochée

Merci par avance.

**SpaceFrog** · 26/02/2008, 16h16

Code :

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

onchange="completeMail()"

ne pas oublier onchange ne se declenche que lorsque deux conditions sont réunies: le contenu change ET l'objet perd le focus

**killingspree** · 26/02/2008, 16h18

Oui oui je sais, cela fonctionne avec IE, lorsque je fais tabulation par exemple ou que je clique ailleurs mais sous firefox rien ne se passe ...

Merci par avance

**SpaceFrog** · 26/02/2008, 16h21

tu as bein des id et pas des names ...
on peut voir les inputs aussi ?

**killingspree** · 26/02/2008, 16h26

J'ai les 2.

Code :

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

<input name="nomAgent" id="nomAgent" onchange="completeMail()">

Merci par avance

**SpaceFrog** · 26/02/2008, 16h28

Code :

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

<input name="nomAgent" id="nomAgent" onchange="completeMail()" type='text' />

manque le type et la fermeture ...

**killingspree** · 26/02/2008, 16h30

Mais je pense que le soucis vient de la configuration de Firefox car lorsque je mets quelque chose dans le champ nomAgent par exemple et que je fais un refresh de la page, ma saisie reste dans le champ, bizarre .... !

Même avec le type et la fermeture cela ne fonctionne pas.
D'ailleurs la fermeture n'est-elle pas facultative pour une balise de la sorte ?

Merci par avance