|
 Trouver une ressource
Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !
 AFFICHE UN CALENDRIER SOUS UNE ZONE DE SAISIE
 Information sur la source
 Description
Ce script affiche un calendrier en dessous d'une zone de saisie, avec en + : -contrôle de date -les jours feriés & jours de pause -modifié pour tourner sous firefox script ultra léger et super efficace !
 Source
- <html>
- <head>
-
- <style>
- input {border:1px blue solid;width:80px;}
- body {font-family:Tahoma;font-size:12px}
- td {font-family:Tahoma;font-size:12px}
- </style>
-
- <script language="javascript">
- moisX=["","Janvier","Fevrier","Mars","Avril","Mai","Juin","Juillet","Aout","Septembre","Octobre","Novembre","Decembre"];
- JourM=["Di","Lu","Ma","Me","Je","Ve","Sa"];
-
- var fermable_microcal=true;
- var select_old= null;
-
- var startWeek=0;//debut de la semaine 0=dim,1=lun,...
- var jourPause={0:true,6:true}; //jour de pause de la semaine
- var jourFeriee={"1-1":"jour an","1-5":"fête du travail","8-5":"armistice","14-7":"fête nationale","15-8":"ascencion","1-11":"armistice","11-11":"toussain","25-12":"noel"};
-
- //structure la date
- function strucDate(dateX)
- {return {"pos":dateX.getDay(),"jour":dateX.getDate(),"mois":dateX.getMonth()+1,"annee":dateX.getFullYear()};}
-
-
- var dateS= strucDate(new Date());//date Selectionné
- var dnow= strucDate(new Date());//date actuelle
-
-
- //retourne le ième jour du 1er du mois
- function premJourMois(mois,annee)
- {return (new Date(annee,mois-1,1).getDay());}
- //retourne le jour max du mois
- function JmaxMois(mois,annee)
- {return (new Date(annee,mois,0).getDate());}
-
-
- /* Test une date si elle est correct...spécial killer*/
- function testTypeDate(dateEntree)
- {
- tst=false;
- try
- {rc=dateEntree.split("/");nd=new Date(rc[2],(rc[1]-1),rc[0]);
- tst=(rc[2]>1800&&rc[2]<2200&&rc[2]==nd.getFullYear()&&rc[1]==(nd.getMonth()+1)&&rc[0]==nd.getDate());
- } catch(e) {}
- return tst;
- }
-
- //selection de la zone avec la souris
- function choix(koi,code)
- {
- if (code)
- { select_old= koi.style.background;
- koi.style.background ='#c0c0FF';
- }
- else
- {
- koi.style.background =select_old;
- }
- }
-
-
- function testTravail(oldX,xx,jj,mm,aa)
- {
- styleX="font-family:Tahoma;font-size:10px;text-align:center;";
- styleX+=(oldX)?"":"color:#e0e0e0;";
- styleX+="cursor:hand;border-right:1px #e0e0e0 solid;border-bottom:1px #e0e0e0 solid;";
- if (jourPause[xx]||jourFeriee[jj+"-"+mm]!=null) styleX+="background:#f0f0f0;";
- if (jj==dnow.jour&&mm==dnow.mois&&aa==dnow.annee) styleX+="border:2px red solid;";
- return styleX;
- }
-
- //test si année bissextile
- function bissextile(annee) {
- return (annee%4==0 && annee %100!=0 || annee%400==0);
- }
-
- //Retourne le nombre de jour depuis le 1er janvier (num de semaine)
- function nbJAnnee(dateX){
- var nb_mois=[,0,31,59,90,120,151,181,212,243,273,304,334];
- j=dateX.jour ; m=dateX.mois ; a=dateX.annee;
- nb=nb_mois[m]+j-1 ;
- if (bissextile(a) && m>2) nb++;
- return nb;
- }
-
- //affiche le calendrier
- function view_microcal(actif,ki,source,mxS,axS)
- {
- if (actif)
- {
- //decalage du mois su on clique sur -/+
- if (mxS!=-1)
- {
- clearTimeout(cc);
- ki.focus();
- fermable_microcal=true;
- dateS.mois=mxS;
- dateS.annee=axS;
- if (dateS.mois<1) {dateS.annee--;dateS.mois+=12;}
- if (dateS.mois>12) {dateS.annee++;dateS.mois-=12;}
- }
- //init
- Dstart=(premJourMois(dateS.mois,dateS.annee)+7-startWeek)%7;
- jmaxi=JmaxMois(dateS.mois,dateS.annee);
- jmaxiAvant=JmaxMois((dateS.mois-1),dateS.annee);
- //si on veux ajouter le numero de la semaine ...
- //idxWeek=parseInt(nbJAnnee(strucDate(new Date(dateS.mois+'-01-'+dateS.annee)))/7,10)+1;
-
- ymaxi=parseInt((jmaxi+Dstart+1)/7,10);
-
- //generation du tableau
- //--entête
- htm="<table><tr style='font-size:10px;font-family:Tahoma;text-align:center;'>";
- htm+="<td style='cursor:hand;' onclick=\"view_microcal(true,"+ki.id+","+source.id+","+(dateS.mois-1)+","+dateS.annee+");\">-</td>";
- htm+="<td colspan='5'> <b> "+moisX[dateS.mois]+"</b> "+dateS.annee+"</td>";
- htm+="<td style='cursor:hand;' onclick=\"view_microcal(true,"+ki.id+","+source.id+","+(dateS.mois+1)+","+dateS.annee+")\">+</td></tr>";
- //--corps
- htm+="<tr>";
- //affichage des jours DLMMJVS
- for (x=0;x<7;x++)
- htm+="<td style='font-size:10px;font-family:Tahoma;'><b>"+JourM[(x+startWeek)%7]+"</b></td>";
- htm+="</tr>"
-
-
- //------------------------
- for (y=0;y<=ymaxi;y++)
- {
- htm+="<tr>";
- for (x=0;x<7;x++)
- {
- idxP=y*7+x-Dstart+1; //numero du jour
- aa=dateS.annee;
- xx=(x+startWeek)%7;
- //jour du mois précedent
- if (idxP<=0)
- {
- jj=idxP+jmaxiAvant;mm=dateS.mois-1;
- if (mm==0)
- {mm=12;aa--;}
- htm+="<td style='"+testTravail(false,xx,jj,mm,aa)+"' onmouseover='choix(this,true)' onmouseout='choix(this,false)' onclick=\""+(ki.id)+".value='"+((jj<10)?"0":"")+jj+"/"+((mm<10)?"0":"")+mm+"/"+aa+"';"+(ki.id)+".style.color='black';\">"+jj+"</td>";
- }
- else if (idxP>jmaxi) //jour du mois suivant
- {
- jj=idxP-jmaxi;mm=dateS.mois+1;
- if (mm==13)
- {mm=1;aa++;}
-
- htm+="<td style='"+testTravail(false,xx,jj,mm,aa)+"' onmouseover='choix(this,true)' onmouseout='choix(this,false)' onclick=\""+(ki.id)+".value='"+((jj<10)?"0":"")+jj+"/"+((mm<10)?"0":"")+mm+"/"+aa+"';"+(ki.id)+".style.color='black';\">"+jj+"</td>";}
- else //jour du mois en cours
- {
- jj=idxP;mm=dateS.mois;
- htm+="<td style='"+testTravail(true,xx,jj,mm,aa)+"' onmouseover='choix(this,true)' onmouseout='choix(this,false)' onclick=\""+(ki.id)+".value='"+((jj<10)?"0":"")+jj+"/"+((mm<10)?"0":"")+mm+"/"+aa+"';"+(ki.id)+".style.color='black';\">"+jj+"</td>";}
- }
- htm+="</tr>"
- }//-------------------------
- htm+="</table>"
- //affiche le tableau
- source.innerHTML=htm;
- source.style.visibility="";
- } else
- {
- //ferme le calendrier
- if (fermable_microcal)
- cc=setTimeout(source.id+".style.visibility='hidden'",500);
- }
- }
-
- </script>
-
- </head>
- <body style="margin:0px">
- <center>
- <br><br><b>micro-calendrier <i>par AmRouNiX (A. Selim)</i><b><br><a href="http://www.crew.free.fr">http://www.crew.free.fr</a><br><br>
- Saisissez une date au format JJ/MM/AAAA
- <table cellpadding="0" cellspacing="0">
- <tr><td ><input type="text" maxlength="10" id="dateDebut" onfocus="view_microcal(true,dateDebut,microcal,-1,0);" onblur="view_microcal(false,dateDebut,microcal,-1,0);" onkeyup="this.style.color=testTypeDate(this.value)?'black':'red'"></td></tr>
- <tr><td><div id="microcal" style="visibility:hidden;position:absolute;border:2px red dashed;background:#ffffff;"></div></td></tr>
- </table>
- <center>
- </body>
- </html>
<html>
<head>
<style>
input {border:1px blue solid;width:80px;}
body {font-family:Tahoma;font-size:12px}
td {font-family:Tahoma;font-size:12px}
</style>
<script language="javascript">
moisX=["","Janvier","Fevrier","Mars","Avril","Mai","Juin","Juillet","Aout","Septembre","Octobre","Novembre","Decembre"];
JourM=["Di","Lu","Ma","Me","Je","Ve","Sa"];
var fermable_microcal=true;
var select_old= null;
var startWeek=0;//debut de la semaine 0=dim,1=lun,...
var jourPause={0:true,6:true}; //jour de pause de la semaine
var jourFeriee={"1-1":"jour an","1-5":"fête du travail","8-5":"armistice","14-7":"fête nationale","15-8":"ascencion","1-11":"armistice","11-11":"toussain","25-12":"noel"};
//structure la date
function strucDate(dateX)
{return {"pos":dateX.getDay(),"jour":dateX.getDate(),"mois":dateX.getMonth()+1,"annee":dateX.getFullYear()};}
var dateS= strucDate(new Date());//date Selectionné
var dnow= strucDate(new Date());//date actuelle
//retourne le ième jour du 1er du mois
function premJourMois(mois,annee)
{return (new Date(annee,mois-1,1).getDay());}
//retourne le jour max du mois
function JmaxMois(mois,annee)
{return (new Date(annee,mois,0).getDate());}
/* Test une date si elle est correct...spécial killer*/
function testTypeDate(dateEntree)
{
tst=false;
try
{rc=dateEntree.split("/");nd=new Date(rc[2],(rc[1]-1),rc[0]);
tst=(rc[2]>1800&&rc[2]<2200&&rc[2]==nd.getFullYear()&&rc[1]==(nd.getMonth()+1)&&rc[0]==nd.getDate());
} catch(e) {}
return tst;
}
//selection de la zone avec la souris
function choix(koi,code)
{
if (code)
{ select_old= koi.style.background;
koi.style.background ='#c0c0FF';
}
else
{
koi.style.background =select_old;
}
}
function testTravail(oldX,xx,jj,mm,aa)
{
styleX="font-family:Tahoma;font-size:10px;text-align:center;";
styleX+=(oldX)?"":"color:#e0e0e0;";
styleX+="cursor:hand;border-right:1px #e0e0e0 solid;border-bottom:1px #e0e0e0 solid;";
if (jourPause[xx]||jourFeriee[jj+"-"+mm]!=null) styleX+="background:#f0f0f0;";
if (jj==dnow.jour&&mm==dnow.mois&&aa==dnow.annee) styleX+="border:2px red solid;";
return styleX;
}
//test si année bissextile
function bissextile(annee) {
return (annee%4==0 && annee %100!=0 || annee%400==0);
}
//Retourne le nombre de jour depuis le 1er janvier (num de semaine)
function nbJAnnee(dateX){
var nb_mois=[,0,31,59,90,120,151,181,212,243,273,304,334];
j=dateX.jour ; m=dateX.mois ; a=dateX.annee;
nb=nb_mois[m]+j-1 ;
if (bissextile(a) && m>2) nb++;
return nb;
}
//affiche le calendrier
function view_microcal(actif,ki,source,mxS,axS)
{
if (actif)
{
//decalage du mois su on clique sur -/+
if (mxS!=-1)
{
clearTimeout(cc);
ki.focus();
fermable_microcal=true;
dateS.mois=mxS;
dateS.annee=axS;
if (dateS.mois<1) {dateS.annee--;dateS.mois+=12;}
if (dateS.mois>12) {dateS.annee++;dateS.mois-=12;}
}
//init
Dstart=(premJourMois(dateS.mois,dateS.annee)+7-startWeek)%7;
jmaxi=JmaxMois(dateS.mois,dateS.annee);
jmaxiAvant=JmaxMois((dateS.mois-1),dateS.annee);
//si on veux ajouter le numero de la semaine ...
//idxWeek=parseInt(nbJAnnee(strucDate(new Date(dateS.mois+'-01-'+dateS.annee)))/7,10)+1;
ymaxi=parseInt((jmaxi+Dstart+1)/7,10);
//generation du tableau
//--entête
htm="<table><tr style='font-size:10px;font-family:Tahoma;text-align:center;'>";
htm+="<td style='cursor:hand;' onclick=\"view_microcal(true,"+ki.id+","+source.id+","+(dateS.mois-1)+","+dateS.annee+");\">-</td>";
htm+="<td colspan='5'> <b> "+moisX[dateS.mois]+"</b> "+dateS.annee+"</td>";
htm+="<td style='cursor:hand;' onclick=\"view_microcal(true,"+ki.id+","+source.id+","+(dateS.mois+1)+","+dateS.annee+")\">+</td></tr>";
//--corps
htm+="<tr>";
//affichage des jours DLMMJVS
for (x=0;x<7;x++)
htm+="<td style='font-size:10px;font-family:Tahoma;'><b>"+JourM[(x+startWeek)%7]+"</b></td>";
htm+="</tr>"
//------------------------
for (y=0;y<=ymaxi;y++)
{
htm+="<tr>";
for (x=0;x<7;x++)
{
idxP=y*7+x-Dstart+1; //numero du jour
aa=dateS.annee;
xx=(x+startWeek)%7;
//jour du mois précedent
if (idxP<=0)
{
jj=idxP+jmaxiAvant;mm=dateS.mois-1;
if (mm==0)
{mm=12;aa--;}
htm+="<td style='"+testTravail(false,xx,jj,mm,aa)+"' onmouseover='choix(this,true)' onmouseout='choix(this,false)' onclick=\""+(ki.id)+".value='"+((jj<10)?"0":"")+jj+"/"+((mm<10)?"0":"")+mm+"/"+aa+"';"+(ki.id)+".style.color='black';\">"+jj+"</td>";
}
else if (idxP>jmaxi) //jour du mois suivant
{
jj=idxP-jmaxi;mm=dateS.mois+1;
if (mm==13)
{mm=1;aa++;}
htm+="<td style='"+testTravail(false,xx,jj,mm,aa)+"' onmouseover='choix(this,true)' onmouseout='choix(this,false)' onclick=\""+(ki.id)+".value='"+((jj<10)?"0":"")+jj+"/"+((mm<10)?"0":"")+mm+"/"+aa+"';"+(ki.id)+".style.color='black';\">"+jj+"</td>";}
else //jour du mois en cours
{
jj=idxP;mm=dateS.mois;
htm+="<td style='"+testTravail(true,xx,jj,mm,aa)+"' onmouseover='choix(this,true)' onmouseout='choix(this,false)' onclick=\""+(ki.id)+".value='"+((jj<10)?"0":"")+jj+"/"+((mm<10)?"0":"")+mm+"/"+aa+"';"+(ki.id)+".style.color='black';\">"+jj+"</td>";}
}
htm+="</tr>"
}//-------------------------
htm+="</table>"
//affiche le tableau
source.innerHTML=htm;
source.style.visibility="";
} else
{
//ferme le calendrier
if (fermable_microcal)
cc=setTimeout(source.id+".style.visibility='hidden'",500);
}
}
</script>
</head>
<body style="margin:0px">
<center>
<br><br><b>micro-calendrier <i>par AmRouNiX (A. Selim)</i><b><br><a href="http://www.crew.free.fr">http://www.crew.free.fr</a><br><br>
Saisissez une date au format JJ/MM/AAAA
<table cellpadding="0" cellspacing="0">
<tr><td ><input type="text" maxlength="10" id="dateDebut" onfocus="view_microcal(true,dateDebut,microcal,-1,0);" onblur="view_microcal(false,dateDebut,microcal,-1,0);" onkeyup="this.style.color=testTypeDate(this.value)?'black':'red'"></td></tr>
<tr><td><div id="microcal" style="visibility:hidden;position:absolute;border:2px red dashed;background:#ffffff;"></div></td></tr>
</table>
<center>
</body>
</html>
 Sources du même auteur
 Sources de la même categorie
Sources en rapport avec celle ci
 Commentaires et avis
 Discussions en rapport avec ce code source dans le forum
javascript et formulaire [ par CHABRY ]
Bonjour, je me demande comment puis-je déterminer un par un les noms de chapms de saisie d'un formulaire car je pense construire un fichier .js qui s
javascript qui foire [ par jofer ]
salut à tousvoilà j'ai fait un petit code javascrit pour faire des alertes dasn le cadre d'une saisie. les deux alertes (avec focus) fonctionne sauf q
téléchargement d'un calendrier en javascript [ par FIFI69 ]
il n'y a rien dans le téléchargement, seulement des raccourcis et des liens.
Problème avec les popup [ par vodkapomme43 ]
Bonjour à tous,Voila mon problème: j'ai crée un bouton qui execute un javascript: il affiche une popup avec un calendrier (le bouton se
DateTimePicker [ par theboboteam ]
Bonjour, peut on utiliser l'activeX DateTimePicker en javascript pour afficher un calendrier dans mes pages htm?j'ai bien vue des sources de calendrie
calendar javascripte [ par arouwa ]
Bonjour,je veux verifier si la date a été sélectionnée dans ma page, alors je vbeux le faire avec du javascripte alors je passe mon objet calendar dan
[Debutant] [Javascript] Désactivation aide saisie FireFox saur un champ [ par infonini ]
Bonjour,Je cherche à désactiver sur un champ (input text) l'aide à la saisie de firefox, afin de mettre ma propre aide à la saisieEst ce que quelqu'un
un input en ecoute un autre? [ par newlc ]
Salut,je souhaite faire un truc tout bête en javascript,en faite je voudrais que lorsque que l'on saisie du texte dans un input et bien que le second
Formatage de chaine javascript [ par shaft107 ]
slt à tousj'ai 4 petits pb,1) je voudrai en réalité changer le format de ma date après la saisie ex : l'utilisateur saisi 20092004 et moi je lui prése
JavaScript sur safari [ par Thundrax ]
Hello,Je suis entrain de faire une appli web, alors évidement je suis entrain de test sur différent navigateur.J'ouvre un popup d'une fenêtre formaté
|
 Téléchargements
Logiciels à télécharger sur le même thème :
Comparez les prix Nouvelle version
|