CodeS-SourceS est hébergé par Frontier.fr

Ce site au démarrage

begin process at 2012 02 13 22:32:02

Accueil Codes Tutoriels Forum Livres Emploi Services Connexion

Trouver un code source :

dans

[ Dernières recherches ]

Accueil >

SAISIE DE DATE DANS UN FORMULAIRE

Information sur la source

Note :

8,50 / 10

Catégorie :Formulaire Niveau :Initié Date de création :28/05/2003 Date de mise à jour :29/05/2003 12:12:07 Vu :20 509

Auteur : mrshardax

Ecrire un message privé

Commentaire sur cette source (0)

Ajouter un commentaire et/ou une note

Description

Ce script affiche des comboboxs de saisie de date dont le nombre de jour est mis a jour dynamiquement en fonction de l'annee et du mois.

Cette script ressort une date formatée du type jj/mm/aaaa dans une variable nomée.

Le source suivant est a copier/coller dans un fichier nommé Date.js (ouvrez un fichier texte et renommez le en "Date.js").

Source

/*
Fichier "Date.js"
Author : Mr Shardax
Date : terça-feira, 27 de Maio de 2003
Cette fonction affiche des cases de saisie de date mis a jour dynamiquement en fonction de l'année et du mois.
La syntaxe d'appel est la suivante :
<script language='Javascript' src='Date.js'>
A ajouter en debut de page (entre les balises <HEAD></HEAD>). Si le fichier n'est pas dans le même répertoire que votre page, modifiez la variable 'src'.
Et cette ligne à ajouter à l'INTERIEUR d'un formulaire HTML (entre les balises <form></form>) là ou vous voulez voir apparaitre les champs de saisie de date :
<script language='Javascript'>document.write(displayDate(nomDuFormulaire,nomDeLaDate) ;</script>
ou 'nomDuFormulaire' est le nom de votre formulaire et nomDeLaDate est le nom de la variable (type chaine de charactère) qui contiendra la date formatée (de la façon suivante : jj/mm/aaaa) à recupérer après envoie du formulaire (methode GET ou POST)
Pour tout commentaire : mr_shardax@voila.fr
Note : les annees ne peuvent etre que positives.
*/
function displayDate(nameOfForm,nameOfField) {
var months = new Array("January", "February", "Mars", "April", "May", "June", "July", "August", "September", "October", "November", "December") ;
var HTMLCode = "" ;
var yearValue = "document."+nameOfForm+"."+nameOfField+"Year.value" ;
var monthValue = "document."+nameOfForm+"."+nameOfField+"Month.value" ;
var dayValue = "document."+nameOfForm+"."+nameOfField+"Day.value" ;
var func = "Javascript: document."+nameOfForm+"."+nameOfField+".value = \"\"+"+dayValue+"+\"/\"+"+monthValue+"+\"/\"+"+yearValue+"+\"\";" ;
// Field of Day
HTMLCode += " Day : <select name='"+nameOfField+"Day' onChange='" +func+"'>" ;
for(i=0 ; i<numberOfDays(monthValue,yearValue) ; i++) {
HTMLCode += "<OPTION VALUE='" +(i+1)+ "'>" +(i+1)+ "</OPTION>" ;
}
HTMLCode += "</select>" ;
// Field of Month
HTMLCode += " Month : <select name='"+nameOfField+"Month' onChange='" +func+" "+modifyDayListe(nameOfForm,nameOfField)+"'>" ;
for(i=0 ; i<12 ; i++) {
HTMLCode += "<OPTION VALUE='" +(i+1)+ "'>" +months[i]+ "</OPTION>" ;
}
HTMLCode += "</select>" ;
// Field of Year
HTMLCode += "Year : <input name='"+nameOfField+"Year' size=4 maxlength=4 onBlur='" +func+" "+modifyDayListe(nameOfForm,nameOfField)+" "+controlYear(nameOfForm,nameOfField)+"'>" ;
// Hidden Field : use to store the formatted date.
HTMLCode += "<INPUT type=hidden name="+nameOfField+">"
return HTMLCode ;
}
function numberOfDays(m,y) {
// If we are in february ....
if(m==2) {
// ... and a leap-year
if(y%4 == 0){return 29 ; }
// ... else
return 28 ;
}
// Otherwise, for the month of April, June, September and November
if(m==4 || m==6 || m==9 || m==10) { return 30 ; }
// For the others
return 31 ;
}
function controlYear(form,field) {
var HTMLCode ;
// generate code in order to control if the year is numeric
HTMLCode = "var c ;\n"
+ "for(i=0 ; i<document."+form+"."+field+"Year.value.length ; i++){ \n"
+ " c = document."+form+"."+field+"Year.value.charAt(i) ;\n"
+ " if(c<\"0\" || c>\"9\") { \n"
+ " alert(\"Year must be a numeric.\") ; \n"
+ " document."+form+"."+field+"Year.value = \"\" ; \n"
+ " }\n"
+ "} ;\n" ;
return HTMLCode ;
}
function modifyDayListe(form,field) {
// generate code which generate the code to display the combobox which contain days
// Save the value of the selected index
var HTMLCode = "var x = document."+form+"."+field+"Day.selectedIndex ; " ;
// delete old liste
HTMLCode += "document."+form+"."+field+"Day.options.length=0 ;\n" ;
// insert all the days
HTMLCode += "for(i=0;i<numberOfDays(document."+form+"."+field+"Month.value,document."+form+"."+field+"Year.value) ; i++) {\n";
HTMLCode += "o=new Option((i+1),(i+1));\n" ;
HTMLCode += "document."+form+"."+field+"Day.options[document."+form+"."+field+"Day.options.length]=o;\n" ;
HTMLCode += "}" ;
// re-select the index
HTMLCode += " document."+form+"."+field+"Day.selectedIndex = x ; " ;
return HTMLCode ;
}

/*
                Fichier "Date.js"


	Author : Mr Shardax
	Date   : terça-feira, 27 de Maio de 2003


	Cette fonction affiche des cases de saisie de date mis a jour dynamiquement en fonction de l'année et du mois.


	La syntaxe d'appel est la suivante : 

	<script language='Javascript' src='Date.js'>
	A ajouter en debut de page (entre les balises <HEAD></HEAD>). Si le fichier n'est pas dans le même répertoire que votre page, modifiez la variable 'src'.




	Et cette ligne à ajouter à l'INTERIEUR d'un formulaire HTML (entre les balises <form></form>) là ou vous voulez voir apparaitre les champs de saisie de date :

	<script language='Javascript'>document.write(displayDate(nomDuFormulaire,nomDeLaDate) ;</script> 
	
	ou 'nomDuFormulaire' est le nom de votre formulaire et nomDeLaDate est le nom de la variable (type chaine de charactère) qui contiendra la date formatée (de la façon suivante : jj/mm/aaaa) à recupérer après envoie du formulaire (methode GET ou POST)


	Pour tout commentaire : mr_shardax@voila.fr


	Note : les annees ne peuvent etre que positives.

*/





function displayDate(nameOfForm,nameOfField) {

	var months = new Array("January", "February", "Mars", "April", "May", "June", "July", "August", "September", "October", "November", "December") ;

	var HTMLCode = "" ; 

	var yearValue  = "document."+nameOfForm+"."+nameOfField+"Year.value" ;
	var monthValue = "document."+nameOfForm+"."+nameOfField+"Month.value" ;
	var dayValue   = "document."+nameOfForm+"."+nameOfField+"Day.value" ;
		
	var func = "Javascript: document."+nameOfForm+"."+nameOfField+".value = \"\"+"+dayValue+"+\"/\"+"+monthValue+"+\"/\"+"+yearValue+"+\"\";" ;


	// Field of Day
	HTMLCode += " Day : <select name='"+nameOfField+"Day' onChange='" +func+"'>" ;		
	for(i=0 ; i<numberOfDays(monthValue,yearValue) ; i++) {
		HTMLCode += "<OPTION VALUE='" +(i+1)+ "'>" +(i+1)+ "</OPTION>" ;
	}
	HTMLCode += "</select>" ;

	// Field of Month
	HTMLCode += " Month : <select name='"+nameOfField+"Month' onChange='" +func+" "+modifyDayListe(nameOfForm,nameOfField)+"'>" ;
	for(i=0 ; i<12 ; i++) {
		HTMLCode += "<OPTION VALUE='" +(i+1)+ "'>" +months[i]+ "</OPTION>" ;
	}
	HTMLCode += "</select>" ;
		
	// Field of Year
	HTMLCode += "Year : <input name='"+nameOfField+"Year' size=4 maxlength=4 onBlur='" +func+" "+modifyDayListe(nameOfForm,nameOfField)+" "+controlYear(nameOfForm,nameOfField)+"'>" ;

	// Hidden Field : use to store the formatted date.
	HTMLCode += "<INPUT type=hidden name="+nameOfField+">"

	return HTMLCode ;
}




function numberOfDays(m,y) {

	// If we are in february ....
	if(m==2) { 
		// ... and a leap-year 
		if(y%4 == 0){return 29 ; }
		// ... else
		return 28 ;
	}
		
	// Otherwise, for the month of April, June, September and November
	if(m==4 || m==6 || m==9 || m==10) { return 30 ; }
		
	// For the others
	return 31 ;
}



function controlYear(form,field) {
	var HTMLCode ;
	
	// generate code in order to control if the year is numeric
	
	HTMLCode =	"var c ;\n"
			  + "for(i=0 ; i<document."+form+"."+field+"Year.value.length ; i++){ \n" 
			  +	"  c = document."+form+"."+field+"Year.value.charAt(i) ;\n"
			  + "  if(c<\"0\" || c>\"9\") { \n" 
			  + "    alert(\"Year must be a numeric.\") ; \n"
			  + "    document."+form+"."+field+"Year.value = \"\" ; \n"
			  + "  }\n"
			  + "} ;\n" ;
			  
	return HTMLCode ; 
}

function modifyDayListe(form,field) {

	// generate code which generate the code to display the combobox which contain days

	// Save the value of the selected index
	var HTMLCode = "var x = document."+form+"."+field+"Day.selectedIndex ; " ;

	// delete old liste
	HTMLCode += "document."+form+"."+field+"Day.options.length=0 ;\n" ;

	// insert all the days
	HTMLCode += "for(i=0;i<numberOfDays(document."+form+"."+field+"Month.value,document."+form+"."+field+"Year.value) ; i++) {\n";
	HTMLCode += "o=new Option((i+1),(i+1));\n" ;
	HTMLCode +=	"document."+form+"."+field+"Day.options[document."+form+"."+field+"Day.options.length]=o;\n" ;
	HTMLCode += "}" ;
		
	// re-select the index
	HTMLCode += " document."+form+"."+field+"Day.selectedIndex = x ; " ;
	
	return HTMLCode ;
}

Conclusion

Le seul petit inconvenients connu est un petit saut de la date a la perte de focus de l un des champs (aucun probleme, c juste pas tres "esthetique" !)

Pour les questions : mr_shardax@voila.fr

Sources de la même categorie

BOITE DE DIALOGUE MODALE DE SÉLECTION D'UNE LISTE D'ICONES par JJDai

RÉSOLUTION D'UN SYSTÈME D'ÉQUATIONS LINÉAIRES À N INCONNUES par william voirol

PLUGIN JQUERY LISTE MODIFIABLE (COMBO) AUTOCOMPLÉTÉE par medkarim

GESTION DE NUMÉRO DE TÉLÉPHONE SIMPLE DANS FIREFOX7 par rotomtom

RECOMMANDER CETTE PAGE AVEC MAILTO, ACCENT ET RETOUR LIGNE D... par weabow

Toutes les sources de la catégorie Formulaire

Commentaires et avis

Aucun commentaire pour le moment.

Ajouter un commentaire

Nos sponsors

Derniers Blogs

XNA IS DEAD! par richardc

TECHDAYS PARIS 2012 : WINDOWS SERVER "8" QUOI DE 9 ! par ROMELARD Fabrice

[HTML5] AUTOUR DU W3C : NOUVEAUX STANDARDS ET WEB MOBILE (LILLE) par Gio

TECHDAYS PARIS 2012 : CHUCK MORRIS N'A PAS PEUR DES MALWARES, CE SONT LES MALWARES QUI ONT PEUR DE CHUCK MORRIS par ROMELARD Fabrice

[WP7] DYNAMICALLY CHANGE STARTUP PAGE par KooKiz

Forum

RE : MENU VERTICAL DéROULANT par lordmacrage

RE : REMPLACER UN SOUS CHAINE DANS UNE AUTRE par Renfield

REMPLACER UN SOUS CHAINE DANS UNE AUTRE par stealon

GOOGLE MAP PB ZINDEX MARKER par philou8

RE : AIDE SUR UN SCRIPT?? par NHenry

Côté IT

Offres d'emploi

Formations Video

Appels d'offres

URGENT - Realisation d-un flux standard XML -NewsML- CAHIER DES CHARGES DISPONIBLE
Budget : 400€
Creation de newsletter sur une page Facebook
Budget : 400€
fichier d-export de site OS commerce ver plateforme logistique-CDC disponible
Budget : 1 200€

Logiciels

DocTranslate (V3.1.0.0)
DOCTRANSLATE (V3.1.0.0)

DocTranslate est un traducteur de document Microsoft Word, PowerPoint et Excel. Il permet d'autom...

Cliquez pour télécharger DocTranslate
Tribler (2012)
TRIBLER (2012)

Tribler est un client pair à pair (P2P/Peer-to-Peer) open source avec la capacité de regarder des...

Cliquez pour télécharger Tribler
OneSwarm (2012)
ONESWARM (2012)

Le peer-to-peer qui protège votre vie privée, c'est OneSwarm. Ce logiciel de peer-to-peer crypté...

Cliquez pour télécharger OneSwarm
PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V8.4)
PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V8.4)

PONAMEDIA TV DEVIENS HELLLOOO FLASH LA TV SUR VOTRE ORDINATEUR. Toute une plateforme Multi...

Cliquez pour télécharger PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO
Academy System (17.2.1.0)
ACADEMY SYSTEM (17.2.1.0)

Logiciel de gestion des établissements. - élèves/étudiants (inscription, dossier, absence...) -...

Cliquez pour télécharger Academy System