11548 sujets

JavaScript, DOM et API Web HTML5

[Résolu]Concaténation de deux input text dans une autre

Bonjour,

Je suis en train de travailler sur un formulaire d'enregistrement de client.
Je lui demande d'entrer son nom et son prénom dans deux input text et son adresse email (qui est toujours défini par prenom.nom@entreprise.fr) dans une troisième.

Ce que je souhaiterai, c'est qu'une fois le nom et le prénom renseignés, l'adresse email s'inscrive elle-même dans la forme indiquée ci-dessus.
Afin de ne pas rafraichir la page, j'ai pensé à un événement javascript sur les input text.

Le souci est que je ne sais pas comment faire en sorte de récupérer les informations présentes dans les deux premières input text pour les concaténer ensuite dans la troisième.

Un petit bout de code pour vous montrer la situation :


<form method="post" action="index.php?nomlien=traitement_client">
<p>
	Nom : <input type="text" name="Nom" value="<?php echo $NomClient ?>" onFocus=document.getElementById('Nom').value />
	Prénom : <input type="text" name="Prenom" value="<?php echo $PrenomClient ?>" onFocus=document.getElementById('Prenom').value  />
       E-mail : <input type="text" name="Mail" value="
		<?php 
		if (empty($EmailClient)) //Si on avait pas ce client enregistré dans la base, alors on lui attribut directement le mail de type Prenom.Nom@Entreprise.fr
			{
			//C'est ici que je souhaiterai attribuer à $EmailClient la concaténation des deux javascript du dessus
			}
							
			echo $EmailClient;
                ?>" />
</p>
</form>

Modifié par Killaman (17 Nov 2008 - 13:04)
Salut,

alors déjà getElementById a peu de chances de fonctionner sur des éléments sans id Smiley cligne . On pourrait commencer par en rajouter un et du coup en profiter pour associer un LABEL à chaque INPUT.

A condition que j'ai bien compris, tu pourrais essayer ça :
<?php 
// Récupération des variables $NomClient, $PrenomClient, $EmailClient

if (empty($EmailClient) && !empty($NomClient) && !empty($PrenomClient)) {
	$EmailClient = $PrenomClient.'.'.$NomClient.'@entreprise.fr';
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Test</title>
<script type="text/javascript"><!--

String.prototype.trim = function()
{
    return this.replace(/(?:^\s+|\s+$)/g, "");
}

function formatEmail () {
	var Nom = document.getElementById('Nom').value.trim();
	var Prenom = document.getElementById('Prenom').value.trim();
	var Email = document.getElementById('Email').value.trim();
	if (!Email && Nom && Prenom) { 
		document.getElementById('Email').value = Prenom + '.' + Nom + '@entreprise.fr';
	}
}
//--></script>
</head>
<body>
<form method="post" action="index.php?nomlien=traitement_client">
	<p>
		<label for="Nom">Nom : </label>
		<input type="text" name="Nom" id="Nom" value="<?php echo $NomClient ?>" onblur="formatEmail();" />
	</p>
	<p>
		<label for="Prenom">Prenom : </label>
		<input type="text" name="Prenom" id="Prenom" value="<?php echo $PrenomClient ?>" onblur="formatEmail();" />
	</p>
	<p>
		<label for="Email">Email : </label>
		<input type="text" name="Email" id="Email" value="<?php echo $EmailClient ?>" />
	</p>
	<p>
		<input type="submit" />
	</p>
</form>
</body>
</html>
A noter que Javascript pouvant être désactivé il faudra faire un contrôle d'Email vide côté PHP.
Sujet clos
Aller à