Script [JS] calcul de l'age (avec mois + age) [Résolu]

Réponse 2 / 31

Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
15 janv. 2013 à 20:00

voila:

<html>
<head>
<script type="text/javascript">
function calcul_age(id_naissance){	
	var date_naissance=document.getElementById(id_naissance).value;
	//l'appel de la fonction se fait a chaque chiffre tapé, on verifie donc que tous les chiffres de la date ont été tapés pour fair ele calcul
	var reg=new RegExp("^[0-9]{1,2}/[0-9]{1,2}/[0-9]{4}$","i");
	if(reg.test(date_naissance)){
	var elem_n = date_naissance.split('/');
		jour_n = elem_n[0];
		mois_n = elem_n[1];
		annee_n = elem_n[2];
	
	var date_day = new Date();
		jour_day = date_day.getDate();
		mois_day = date_day.getMonth()+1;
		annee_day = date_day.getFullYear();
	
	//calcul age
	var ans; var mois; var age="";
	
	if(mois_day >= mois_n){
		ans =  annee_day - annee_n;
		mois= mois_day - mois_n;
	}else{
		ans =  (annee_day - annee_n) -1;
		mois= mois_day +( 12 - mois_n);
	}
	if(jour_day < jour_n){	
		mois= mois -1;
		if(mois_day < mois_n){
		ans =  ans -1;
		}	
	}
	
	if(ans >0 && ans <=1) age += ans+' an ';
	if(ans >1) age += ans+' ans ';
	if(mois >0) age +=mois+' mois ';
	 // on affiche le résultat
	document.getElementById('reponse').innerHTML = age;
	}else{	
		return false;
	}
}

</script>
</head>
<body>
<form name="my_form" method="post" action="">
Date naissance:<input type="text" name="date_naissance" id="date_naissance" value="" onkeyup="calcul_age('date_naissance');" />(jj/mm/aaaa)<br />
<div id="reponse"><!-- la réponse va s'inscrire ici --></div>
</form>
</body>
</html>

Réponse 3 / 31

Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
Modifié par Alain_42 le 15/01/2013 à 21:49

je ne comprend pas chez moi ça marche,avec FireFox, mais pas avec IE
edit: sous IE il faut autoriser les scripts javascript
pour répondre à ta question voici le code modifié pour s'adapter à plusieurs dates

<html> 
<head> 
<script type="text/javascript"> 
function calcul_age(id_naissance,id_reponse){  
 var date_naissance=document.getElementById(id_naissance).value; 
 //l'appel de la fonction se fait a chaque chiffre tapé, on verifie donc que tous les chiffres de la date ont été tapés pour faire le calcul 
 var reg=new RegExp("^[0-9]{1,2}/[0-9]{1,2}/[0-9]{4}$","i"); 
 if(reg.test(date_naissance)){ 
 var elem_n = date_naissance.split('/'); 
  jour_n = elem_n[0]; 
  mois_n = elem_n[1]; 
  annee_n = elem_n[2]; 
  
 var date_day = new Date(); 
  jour_day = date_day.getDate(); 
  mois_day = date_day.getMonth()+1; 
  annee_day = date_day.getFullYear(); 
  
 //calcul age 
 var ans; var mois; var age=""; 
  
 if(mois_day >= mois_n){ 
  ans =  annee_day - annee_n; 
  mois= mois_day - mois_n; 
 }else{ 
  ans =  (annee_day - annee_n) -1; 
  mois= mois_day +( 12 - mois_n); 
 } 
 if(jour_day < jour_n){  
  mois= mois -1; 
  if(mois_day < mois_n){ 
  ans =  ans -1; 
  }  
 } 
  
 if(ans >0 && ans <=1) age += ans+' an '; 
 if(ans >1) age += ans+' ans '; 
 if(mois >0) age +=mois+' mois '; 
  // on affiche le résultat 
 document.getElementById(id_reponse).innerHTML = age; 
 }else{  
  return false; 
 } 
} 

</script> 
</head> 
<body> 
<form name="my_form" method="post" action=""> 
Date naissance 1:(jj/mm/aaaa)<input type="text" name="date_naissance1" id="date_naissance1" value="" onkeyup="calcul_age('date_naissance1','reponse1');" /> 
 => Réponse:<span id="reponse1"><!-- la réponse 1 va s'inscrire ici --></span> 
<br /><br /> 
Date naissance 2:(jj/mm/aaaa)<input type="text" name="date_naissance2" id="date_naissance2" value="" onkeyup="calcul_age('date_naissance2','reponse2');" />  
=> Réponse:<span id="reponse2"><!-- la réponse 1 va s'inscrire ici --></span> 
</form> 
</body> 
</html>

Réponse 4 / 31

Laharl
13 déc. 2011 à 16:53

Petit up ...

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 31

sommaille Messages postés 63 Date d'inscription mardi 21 décembre 2010 Statut Membre Dernière intervention 16 avril 2016
19 déc. 2011 à 21:22

GROS UP !

Réponse 6 / 31

Caro Isaana Messages postés 16 Date d'inscription lundi 14 janvier 2013 Statut Membre Dernière intervention 21 janvier 2013
15 janv. 2013 à 18:05

Bravo pour ce script.
Je cherche la même chose, mais que ca se fasse automatiquement : que l'on n'ait pas besoin de cliquer sur le bouton 'calculer', mais qu'en fonction de la date du jour, ca nous donne automatiquement l'année et le mois.
Merci d'avance pour votre aide.

Réponse 7 / 31

Caro Isaana Messages postés 16 Date d'inscription lundi 14 janvier 2013 Statut Membre Dernière intervention 21 janvier 2013
15 janv. 2013 à 20:21

Un grand merci pour avoir potassé si rapidement pour moi, c'est vraiment tres gentil.

Alors autant le premier script fonctionnait, autant celui là ne fonctionne pas. A moins que je ne sache pas m'en servir, mais je suppose qu'il faut entre la date, à cet endroit sur le script />(jj/mm/aaaa)<br />

J'ai tenté de mettre 22/12/2005, ca m'a laissé le cadre du résultat vide, alors peut-être je m'y prends mal...

Si je peux abuser, j'aurai souhaité que ce script soit possible plusieurs fois sur la meme page.
En fait, sur certaines pages de mon site, il y a des pedigrees de chiens.
Je donne les dates de naissance de certains des chiens,
et lorsqu'ils sont encore en vie, je donne l'âge qu'ils ont en Année et mois.
Par exemple :
Médor = né le 01.01.2000
le 01/03/2013 il aura 13 ans 2 Mois.
Vu qu'il y a une trentaine de pedigrees et que sur chacun de ces pedigrees il y a plusieurs de ces chiens encore vivants, donc à chaque fois changer les dates, je me demande s'il y a possibilité qu'un script le gere automatiquement.

D'avance, merci pour ton aide !

Réponse 8 / 31

Caro Isaana Messages postés 16 Date d'inscription lundi 14 janvier 2013 Statut Membre Dernière intervention 21 janvier 2013
16 janv. 2013 à 17:14

Bonjour,

Merci encore Alain-42 pour ton nouveau script.

Alors, je l'ai testé. Sur 3 navigateurs différents :
- Firefox,
- IE,
- Google chrome.

Sur les 3 navigateurs (effectivement sur IE ca me demande d'autoriser le script), ca me fait la mm chose :

si je remplace :
Date naissance 1:(jj/mm/aaaa)
par :
Date naissance 1:(14/04/2003)

ca m'affiche

Date naissance 1:(14/04/2003) =>

mais ca ne donne pas le résultat automatiquement.
Par contre si dans le cadre (qui ne s'affiche pas là, mm si je fais un copié/collé) (entre (14/04/2003) et =>) je re-écris la date, là ca affiche le résultat :
Date naissance 1:(06/12/2012) => Réponse:9 ans 9 mois

Ce n'est donc pas possible que j'entre la date sur mon éditeur de site, et que ca s'affiche automatiquement sur le site, sans que l'on fasse une manip ?

Merci d'avance pour ta réponse.
Caro

Réponse 9 / 31

Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
16 janv. 2013 à 17:39

il faut rentrer la date dans le "cadre"

Réponse 10 / 31

Caro Isaana Messages postés 16 Date d'inscription lundi 14 janvier 2013 Statut Membre Dernière intervention 21 janvier 2013
16 janv. 2013 à 17:44

rentrer la date dans le 'cadre' sur mon éditeur de site ?
ou ?
à l'endroit value="" ?

ou tu me dis qu'en fait ca ne peut se mettre automatiquement et que c'est aux gens sur le site de le mettre dans le cadre ?

Merci pour ta réponse.

Réponse 11 / 31

Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
Modifié par Alain_42 le 16/01/2013 à 17:55

je n'avait pas compris, je pensait que tu voulait faire un genre de calculatrice où on rentre une date et ça donne l'age.

Toi ce que tu veux faire c'est rentrer "en dur" la date dans les champs lorsque tu crée ton site et que à côté ça indique l'age
lorsque la page est affichée
ou est que cette date est chargée avec du php ?

Réponse 12 / 31

Caro Isaana Messages postés 16 Date d'inscription lundi 14 janvier 2013 Statut Membre Dernière intervention 21 janvier 2013
16 janv. 2013 à 17:57

Oui, c'est bien ca.
Je n'ose pas mettre le lien d'une des pages de mon site pour te montrer mon histoire de pedigree, dates de naissances, et âge du chien (que je calcule et rajoute chaque mois...... évidemment ca fait bcp de boulot), c'est pour ca que je cherchai un script pour que je le rentre et que ca calcule automatiquement sans que j'ai besoin de le faire moi-même sur chacun des pedigrees.
Merci beaucoup pour ton aide !

Réponse 13 / 31

Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
16 janv. 2013 à 18:53

voila:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr">
<head>
	<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
<script type="text/javascript">
function calcul_age(id_naissance,id_reponse){	
	var date_naissance=document.getElementById(id_naissance).value;
	//l'appel de la fonction se fait a chaque chiffre tapé, on verifie donc que tous les chiffres de la date ont été tapés pour faire le calcul
	var reg=new RegExp("^[0-9]{1,2}/[0-9]{1,2}/[0-9]{4}$","i");
	if(reg.test(date_naissance)){
	var elem_n = date_naissance.split('/');
		jour_n = elem_n[0];
		mois_n = elem_n[1];
		annee_n = elem_n[2];
	
	var date_day = new Date();
		jour_day = date_day.getDate();
		mois_day = date_day.getMonth()+1;
		annee_day = date_day.getFullYear();
	
	//calcul age
	var ans; var mois; var age="";
	
	if(mois_day >= mois_n){
		ans =  annee_day - annee_n;
		mois= mois_day - mois_n;
	}else{
		ans =  (annee_day - annee_n) -1;
		mois= mois_day +( 12 - mois_n);
	}
	if(jour_day < jour_n){	
		mois= mois -1;
		if(mois_day < mois_n){
		ans =  ans -1;
		}	
	}
	
	if(ans >0 && ans <=1) age += ans+' an ';
	if(ans >1) age += ans+' ans ';
	if(mois >0) age +=mois+' mois ';
	 // on affiche le résultat
	document.getElementById(id_reponse).innerHTML = age;
	}else{	
		return false;
	}
}
//fonction qui se lance au chargement de la page pour faire le calcul pour tous les champs input
function calculer_tout(){
	array_input=document.getElementsByTagName('input');
	for (i=0;i< array_input.length;i++){
		var id_naissance=array_input[i].id;
		var id_age='a_'+array_input[i].id.split('_')[1];		
		//lance la fonction calcul pour tous les champs
		calcul_age(id_naissance,id_age);
	}
}
</script>
</head>
<body onload="calculer_tout();">
<!-- 
attention bien garder le format de id=d_1  d_2  d_3 etc.. pour la date de naissance
et id= a_1  a_2 a_3 etc.. pour l'age

readonly c'est pour que le champ ne soit pas modifiable par l'internaute 
--> 

toutou 1 né le:<input type="text" name="date_naissance1" id="d_1" value="14/01/2005"  readonly /> age:<span id="a_1"></span>
<br /><br />
toutout 2 né le<input type="text" name="date_naissance2" id="d_2" value="12/06/2003"  readonly  /> age:<span id="a_2"></span>

</body>
</html>

Réponse 14 / 31

Caro Isaana Messages postés 16 Date d'inscription lundi 14 janvier 2013 Statut Membre Dernière intervention 21 janvier 2013
16 janv. 2013 à 19:57

Alain-42,
Je te remercie pour ta rapidité et ton savoir-faire !
J'ai donc essayé et yes, ca fonctionne et c'est ca,
sauf que......
qu'il y a un soucis dans les résultats des âges.

Tu as mis dans l'exemple
- pour toutou 1 la date du 14/01/2005, ca donne un résultat de 8 ans
- pour tout 2 la date de 12/06/2003, ca donne un résultat de 9 ans 7 mois,
c'est exact pour les 2 dates.

Seulement j'ai essayé de mettre des dates différentes, par exemple :
- 17/05/2005, ca me donne un résultat de 6 ans 7 mois,
alors que le résultat exact est de 7 ans 7 mois
- 28/09/2005 ca me donne un résultat de 6 ans 3 mois
alors que le résultat exact est 7 ans 3 mois
- 23/12/2007 ca me donne un résultat de 4 ans
alors que le résultat exact est de 5 ans
- 27/07/2011 ca me donne un résultat de 5 mois
alors que le résultat exact est de 1 an 5 mois

Comme s'il enlevait 1 an pour les résultats.

Par contre, ce qui est étrange c'est qu'avec d'autres dates que j'ai entré :
14/04/2007 ca me donne un résultat de 5 ans 9 mois,
10/12/2009 ca me donne un résultat de 3 ans 1 mois,
et là les résultats sont exacts.

Tu sais pourquoi ca me fait ca ?

Merci d'avance pour ta réponse.

Réponse 15 / 31

Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
16 janv. 2013 à 20:56

je vais potasser ça de plus près.

Tu as vu j'ai fait virer le message bidon.

Réponse 16 / 31

Caro Isaana Messages postés 16 Date d'inscription lundi 14 janvier 2013 Statut Membre Dernière intervention 21 janvier 2013
16 janv. 2013 à 21:15

Merci beaucoup ! T'es vraiment sympa !

Ah ok, c'était un message bidon ! Ok, je ne comprenais pas. Je ne sais pas comment tu as fait pour le faire virer, mais c'est cool !

Réponse 17 / 31

Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
16 janv. 2013 à 21:48

en haut à droite du message il y a un bouton signaler aux modérateurs

Réponse 18 / 31

Caro Isaana Messages postés 16 Date d'inscription lundi 14 janvier 2013 Statut Membre Dernière intervention 21 janvier 2013
16 janv. 2013 à 21:54

ok, merci pour l'info. Apres, je n'aurai pas su que c'était un mess bidon, et n'aurai pas osé le signaler.

Réponse 19 / 31

Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
16 janv. 2013 à 22:55

voila il y avait un petit bug, j'ai corrigé et rajouté un petit test pour afficher les jours si age=0 et mois <= 3

<script type="text/javascript">
function calcul_age(id_naissance,id_reponse){	
	var date_naissance=document.getElementById(id_naissance).value;
	//l'appel de la fonction se fait a chaque chiffre tapé, on verifie donc que tous les chiffres de la date ont été tapés pour faire le calcul
	var reg=new RegExp("^[0-9]{1,2}/[0-9]{1,2}/[0-9]{4}$","i");
	if(reg.test(date_naissance)){
	var elem_n = date_naissance.split('/');
		jour_n = parseFloat(elem_n[0]);
		mois_n = parseFloat(elem_n[1]);
		annee_n = parseFloat(elem_n[2]);
	
	var date_day = new Date();
		jour_day = date_day.getDate();
		mois_day = date_day.getMonth()+1;
		annee_day = date_day.getFullYear();
	
	//calcul age
	var ans; var mois; var age="";
	
	if(mois_day >= mois_n){
	
		ans =  annee_day - annee_n;
		mois= mois_day - mois_n;
	}else{
		ans =  (annee_day - annee_n) -1;
		mois= mois_day +( 12 - mois_n);
	}
	if(jour_day < jour_n){	
		mois= mois -1;			
	}
	
	if(ans >0 && ans <=1) age += ans+' an ';
	if(ans >1) age += ans+' ans ';
	if(mois >0) age +=mois+' mois ';
	if(ans==0 && mois>=0 && mois <= 3){
		//si moins de 1 an et moins de 3 mois on affiche aussi les jours
		jours=jour_day - jour_n;
		age +=jours+' jours ';
	}
	 // on affiche le résultat
	document.getElementById(id_reponse).innerHTML = age;
	}else{	
		return false;
	}
}

powerguitou Messages postés 472 Date d'inscription vendredi 24 juillet 2009 Statut Membre Dernière intervention 29 janvier 2021 29
16 janv. 2013 à 23:02

Carrément bon le monsieur, mon message ne sert a rien ,mais je tenais a le dire.
:-)

Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
17 janv. 2013 à 09:51

Merci ça fait plaisir
@lain

Réponse 20 / 31

Caro Isaana Messages postés 16 Date d'inscription lundi 14 janvier 2013 Statut Membre Dernière intervention 21 janvier 2013
16 janv. 2013 à 23:37

Oh là là, trop fort ! C'est génial, ca fonctionne parfaitement !
Un énorme merci !!
Et merci pour le bonus des jours, c'est top !

Bon, et moi je suis un chouille fiere de moi, car à la fin sur ton script :

return false;
}
}

je me suis dit : ah , apres il manque le
</script>

Donc je le rajoute, et là ca ne fonctionnait plus........
j'ai donc comparé ton précédent script et le dernier, et j'ai trouvé la partie absente :

//fonction qui se lance au chargement de la page pour faire le calcul pour tous les champs input
function calculer_tout(){
array_input=document.getElementsByTagName('input');
for (i=0;i< array_input.length;i++){
var id_naissance=array_input[i].id;
var id_age='a_'+array_input[i].id.split('_')[1];
//lance la fonction calcul pour tous les champs
calcul_age(id_naissance,id_age);
}
}
</script>

Et là ca fonctionne.
Bon, je n'ai pas de mérite, c'est toi qui a tout fait, mais contente tt de même de comprendre pourquoi ca ne fonctionnait pas.

Je suis désolée, mais je vais encore abuser de tes lumieres, si tu le veux bien :
Par rapport à la mise en page, le 'cadre' me pose un peu de soucis, et je voulais savoir si on pouvait le modifier :
- la taille : si on parle en pixels, il fait 144 px (+ 2 pour les bordures = 146 px),
et vu que je veux insérer ces cadres dans mon tableau, c'est un peu large,
et 70 px (bordures comprises) auraient été suffisants. Donc est-ce qu'il est
possible de modifier la taille de ces cadres ?
- la couleur de fond du cadre ?
- la police du cadre (le texte qui s'affiche, donc la date de naissance) ?

Merci encore pour le temps que tu m'accordes et si pour cette derniere requete ca te soule, ne t'inquiete pas, ce n'est pas grave.

Script [JS] calcul de l'age (avec mois + age)

31 réponses

Discussions similaires