11548 sujets

JavaScript, DOM et API Web HTML5

Bonsoir à tous,
J'ai cette fonction qui marche si je l'utilise avec alert mais qui ne répond pas dès lors que je veux changer le prenom passé dans un formulaire. Voici la fonction :

// Fonction pour un prenom non compose
   function premLetMaj(mot) {
     // var lePrenomSaisi = document.getElementById("lePrenomId").value;
	  //La methode charAT de l'objet String un caractere que l'on transforme en majuscule avec toUpperCase
	  //Avec la methode substring on retourne un bout de la valeur de la variable que l'on force en minuscule
    //  var lePrenomModifie=lePrenomSaisi.charAt(0).toUpperCase() + lePrenomSaisi.substring(1).toLowerCase();
	  //document.getElementById("lePrenomId").value=lePrenomModifie; 
	  // on récupère la première lettre du mot
var premier=mot.substring(0,1);
// on la met en majuscules
premier=premier.toUpperCase();
// on récupère la fin du mot
var fin=mot.substring(1,mot.length);
// on la met en minuscule
fin=fin.toLowerCase();
// on utilise l'opérateur de concaténation pour recoller les morceaux
var motFormat=premier+fin;
// on renvoie le résultat
return motFormat;
}
//alert(premLetMaj("toto"));
   
   
/***************************************************************************************************************************/
 //Fonction pour un prenom compose
 function formatePrenom(prenom){
   // prenom=document.getElementById("lePrenomId").value;
	//on verifie s'il s'agit d'un prenom compose en recherchant la presence d'un separateur (tiret ou espace)
	//on verifie pour cela avec la methode indexOf que le caractère cherche existe. Si ça n'existe pas indexOf retourne -1
	   if (prenom.indexOf("-")!=-1){
	      var separateur="-";
	   }
       
	   else if(prenom.indexOf(" ")!=-1){
	      var separateur=" ";
	   }
	   
	   else{
	   //si on n'a pas trouve alors c'est un prenom simple et on met la 1er lettre en majuscule en appelant la fonction 
	   //premLetMaj()
	   return(premLetMaj());
	   }
	   
	 //Ce code est lu uniquement dans le cas de prenom compose
	 // Je découpe ma chaine en un tableau de chaine avec la methode split 
	 //Le separateur spécifie le caractere a utiliser pour diviser la chaine
	 var prenom_array=prenom.split(separateur);
	 // Je fais une boucle for sur mon tableau de chaine
	    for(i=0; i<prenom_array.length; i++){
		   prenom_array[i]=premLetMaj(prenom_array[i]);
		}
	 // 
		var prenomFormat=prenom_array.join(separateur);
		return prenomFormat;
 }
 


Pour modifier le prénom et l'afficher avec les premières lettres en majuscules j'ai rentré ce code html :

  <input type="text" name="lePrenom" size="30" id="lePrenomId" document.getElementById("lePrenomId").value.onchange=document.getElementById("lePrenomId").value.formatePrenom() /><br />


Mais rien ne se passe. Compte tenu que j'ai testé la focntion avec alert que celà était ok, j'en déduis que c'est au niveau de l'évènement onchange que ça foire.

Quelqu'un aurait il la gentillesse de m'expliquer pourquoi ?

Je l'en remercie d'avance[/i][/i]
Bonjour,

Peut-être que ce soucis est dû au copier / coller mais tu a inséré du code javascript dans l'emplacement réservé à la déclaration d'attributs de l'input.

a écrit :
<input type="text" name="lePrenom" size="30" id="lePrenomId" document.getElementById("lePrenomId").value.onchange=document.getElementById("lePrenomId").value.formatePrenom() />


Voilà qui est plus correct d'un point de vu html (et qui devrait résoudre le problème):
<input type="text" name="lePrenom" size="30" id="lePrenomId" onchange="document.getElementById("lePrenomId").value.formatePrenom()" />


L'évènement onchange reste un attribut html qui te permet d'exécuter du code javascript, mais il faut le déclarer correctement Smiley cligne . Le problème peut également venir d'ailleur, je n'ai pas le temps de vérifier le reste du code.
En effet, j'ai copié une bêtise, on peut le voir déjà sur le forum avec la colorisation (c) du texte.

<input type="text" name="lePrenom" size="30" id="lePrenomId" onchange="document.getElementById('lePrenomId').value.formatePrenom()" />


Voilà pour l'appel de fonction. Mais pas plus de temps pour vérifier le reste.
J'ai trouvé ça marche comme suit :

 <input type="text" name="lePrenom" size="30" id="lePrenomId" onchange="document.getElementById('lePrenomId').value=formatePrenom(document.getElementById('lePrenomId').value)" /><br />


Merci pour ton aide