Accueil > > > SAISIE DE DATE DANS UN FORMULAIRE
 SAISIE DE DATE DANS UN FORMULAIRE
 Information sur la source
 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
 Commentaires et avis
|
Derniers Blogs
 TECHDAYS PARIS 2010 : ADMINISTRATION SHAREPOINT 2010TECHDAYS PARIS 2010 : ADMINISTRATION SHAREPOINT 2010 par ROMELARD Fabrice
Animé par: Patrick Guimonet et Benoit Hamet Cette session traitera des différents points exigés durant les taches d'administration : Planification (architecture, hébergement, authentification, .) Opération e...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice [TECHDAYS 2010] #03 - WEB CONTENT MANAGEMENT SOUS SHAREPOINT 2010[TECHDAYS 2010] #03 - WEB CONTENT MANAGEMENT SOUS SHAREPOINT 2010 par pierre
Stephane Cordonnier de MCNext nous présente les fonctionnalités Web Content Management (WCM) sous SharePoint 2010. Qu'est-ce que le WCM ECM, GED, RM, WCM c'est quoi Plateforme SharePoint Versions SharePoint 2010 SharePoint Fondation...
Cliquez pour lire la suite de l'article par pierre [DESIGN PATTERNS] PARTIE 2: DIP: DEPENDENCY INVERSION PRINCIPLE[DESIGN PATTERNS] PARTIE 2: DIP: DEPENDENCY INVERSION PRINCIPLE par tja
C'est le dernier principe des principes du Design Orienté Objet (The Principles of Object Oriented Design) fondés par Robert C. Martin plus connu sous le pseudonyme d'Uncle Bob.
l'image empruntée de LosTechies.
Je ne traite pas les principes dans...
Cliquez pour lire la suite de l'article par tja TECHDAYS PARIS 2010 : SHAREPOINT 2010 POUR LES DéVELOPPEURSTECHDAYS PARIS 2010 : SHAREPOINT 2010 POUR LES DéVELOPPEURS par ROMELARD Fabrice
Animé par: Laurent Cotton Le développement dans SharePoint 2010 passe par plusieurs axes qui seront évoqués dans cette session, mais plus particulièrement les développements simples lié au besoin Business Business Connectivity Services Ce BCS es...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice TECHDAYS PARIS 2010 : PLEINIèRE DERNIER JOURTECHDAYS PARIS 2010 : PLEINIèRE DERNIER JOUR par ROMELARD Fabrice
Cette session est la dernière pleinière de ces 3 jours de TechDays Paris 2010. Généralement, cette troisième journée est plus axée sur l'avenir vu par Microsoft. Après un retour sur l'avenir vu par la Science Fiction ou par ...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice
Forum
 PETITE HORLOGEPETITE HORLOGE par tatillon
Cliquez pour lire la suite par tatillon
Logiciels
 DB-MAIN (9.1.0)DB-MAIN (9.1.0)DB-MAIN is a data-modeling and data-architecture tool. It is designed to help developers and anal... Cliquez pour télécharger DB-MAIN Xilisoft DPG Convertisseur (5.1.37.0120)XILISOFT DPG CONVERTISSEUR (5.1.37.0120)Xilisoft DPG Convertisseur offre aux fans de Nintendo DS une bonne solution leur permettant de dé... Cliquez pour télécharger Xilisoft DPG Convertisseur GraphicsGale (2.01.01)GRAPHICSGALE (2.01.01)GraphicsGale est un logiciel de PixelArt avec de nombreuse fonctionnalités permettant de réalisé ... Cliquez pour télécharger GraphicsGale Architecte 3D (Platinum 2010)ARCHITECTE 3D (PLATINUM 2010)Architecte 3D Platinium vous permet de concevoir facilement les plans votre future maison, de l'é... Cliquez pour télécharger Architecte 3D TeamViewer 5 (TeamViewer 5)TEAMVIEWER 5 (TEAMVIEWER 5)Dépanner un ami,expliquer une manipulation devient un jeu d'enfant.
Prise en main d'un autre ord... Cliquez pour télécharger TeamViewer 5
|