IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Actualisation d'un champ de date


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre averti
    Profil pro
    Inscrit en
    Novembre 2004
    Messages
    17
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Novembre 2004
    Messages : 17
    Par défaut Actualisation d'un champ de date
    Bonjour à tous.

    Voilà j'essaie de créer un calendrier cliquable !
    Je m'explique : j'ai un formulaire avec la saisie d'une date. Pour simplifier disons par exemple une date d'anniversaire.
    Afin de palier aux différentes saisies et de simplifier la vie de mes utilisateurs, j'ai décidé de créer un petit calendrier cliquable. Un peu comme celui de la sncf si vous voulez.
    J'ai réussi à créer ce calendrier en php.
    Le problème c'est que je ne connais pas vraiment le javascript. Ce que j'aimerais faire :
    - Un popup s'ouvre lorsque l'on clique sur un petit bouton à coté du champs date de mon formulaire.
    - quand on clique sur un jour de mon calendrier la date s'affiche automatiquement dans mon champs date.
    - Et enfin, si possible, que le popup se ferme dès que la date a été sélectionnée.

    Comme je vous l'ai déjà dit, je ne connais pas encore le javascript mais j'ai l'intime conviction, à voir tous les scripts qui existent, que ça doit passer par du javascript.
    Le problème des scripts qui existent c'est qu'ils ne sont quasiment jamais commenté et donc je ne comprends pas grand chose.

    Est-ce que quelqu'un peut m'aider s'il vous plait ??

    Merci d'avance.
    Jeff74

  2. #2
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 659
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 75
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 659
    Billets dans le blog
    1
    Par défaut
    direction les contributions ...
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  3. #3
    Membre averti
    Profil pro
    Inscrit en
    Novembre 2004
    Messages
    17
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Novembre 2004
    Messages : 17
    Par défaut Merci pour cette réponse
    merci pour cette réponse.

    je viens d'aller voir dans les contributions mais comme je l'avais prévu, le code n'est pas super bien expliqué et donc je ne comprend pas grand chose.
    Quelqu'un ne connaitrai pas un tuto qui expliquerai cela?

  4. #4
    Membre averti
    Profil pro
    Inscrit en
    Novembre 2004
    Messages
    17
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Novembre 2004
    Messages : 17
    Par défaut Ca Avance
    Bonjour à tous.
    j'avance à grand pas dans mon calendrier cliquable en m'inspirant de la contribution. (eh oui j'ai été un peu trop vite en disant que je ne comprenais rien.

    Alors j'ai quasiment fini sauf que j'ai quand même un souci. Tant que je n'ai pas besoin d'écrire la date dans mon champ texte mon calendrier marche au poil. Par contre dès que je veux insérer la date dans mon champ, il ne veut plus passer au mois d'avant ou au mois d'après !! (c'est quand même énervant !!)

    Je vous mets ci-dessous mon code javascript qui marche ( c'est à dire qu'on peut changer de mois)
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
    155
    156
    157
    158
    159
    160
    161
    162
    163
    164
    165
    166
    167
    168
    169
    170
    171
    172
    173
    174
    175
    176
    177
    178
    179
    180
    181
    182
    183
    184
    185
    186
    187
    188
    189
    190
    191
    192
    193
    194
    195
    196
    197
    198
    199
    200
    201
    202
    203
    204
    205
    206
    207
    208
    /***********************************************************************************/
    /* Fonction qui permet en fonction du numéro du mois et de l'annee de trouver le nombre de jours */
    /***********************************************************************************/
    function NbJoursMois(mois,annee)
    {
    /* ATTENTION, ici on parle du uméro réel du mois, c'est à dire de 1 à 12 */
    var nbjours;
    switch(mois)
    {
    	case 1 :
    	nbjours = 31;
    	break;
    	
    	case 2 :
    	if(annee%4==0 && annee%100!=0 || annee%400==0)
    	{
    		nbjours = 29;
    	}
    	else
    	{
    		nbjours = 28;
    	}
    	break;
    	
    	case 3 :
    	nbjours = 31;
    	break;
    	case 4 :
    	nbjours = 30;
    	break;
    	case 5 :
    	nbjours = 31;
    	break;
    	case 6 :
    	nbjours = 30;
    	break;
    	case 7 :
    	nbjours = 31;
    	break;
    	case 8 :
    	nbjours = 31;
    	break;
    	case 9 :
    	nbjours = 30;
    	break;
    	case 10 :
    	nbjours = 31;
    	break;
    	case 11 :
    	nbjours = 30;
    	break;
    	case 12 :
    	nbjours = 31;
    	break;
    	
    	default :
    	document.write('Il y a un probleme pour calculer le nombre de jour dans le mois');
    }
    return nbjours;
    }
    
    function EcrireDate(jour,mois,annee,ecrire)
    {
    var date ="";
    if(jour<10)
    {
    	date +="0";
    }
    date +=jour+"/";
    if(mois<10)
    {
    	date +="0";
    }
    date +=mois+"/"+annee;
    
    ecrire.value=date;
    
    return true;
    }
    /***********************************************************************************/
    /* Fonction qui permet en fonction du numéro du mois et de l'annee de trouver le nombre de blancs à  laisser au début du mois*/
    /***********************************************************************************/
    function NbBlancs(mois,annee)
    {
    /** ATTENTION, ici on parle du uméro réel du mois, c'est à dire de 1 à 12 */
    var N_jours = new Array('Di','Lu','Ma','Me','Je','Ve','Sa');
    
    var date_premier_jour = new Date(annee,mois-1,1);
    var premier_jour = N_jours[date_premier_jour.getDay()];
    
    var nb_blancs;
    switch(premier_jour)
    {
    	case "Lu" :
    	nb_blancs = 0;
    	break;
    	case "Ma" :
    	nb_blancs = 1;
    	break;
    	case "Me" :
    	nb_blancs = 2;
    	break;
    	case "Je" :
    	nb_blancs = 3;
    	break;
    	case "Ve" :
    	nb_blancs = 4;
    	break;
    	case "Sa" :
    	nb_blancs = 5;
    	break;
    	case "Di" :
    	nb_blancs = 6;
    	break;
    	default :
    	document.write('Il y a un probleme pour déterminer le nombre de blancs à laisser au début du mois');
    }
    return nb_blancs;
    }
    /***********************************************************************************/
    /******************** Fonction pour l'affichage du calendrier  ****************************/
    /***********************************************************************************/
    function calendrier(mois,annee,affiche,ecrire)
    {
    /** ATTENTION, ici on parle du uméro réel du mois, c'est à dire de 1 à 12 */
    
    /** Deux tableaux pour l'écriture en français **/
    var N_mois = new Array('Janvier','Février','Mars','Avril','Mai','Juin','Juillet','Août','Septembre','Octobre','Novembre','Décembre');
    var N_jours = new Array('Di','Lu','Ma','Me','Je','Ve','Sa');
    
    /** Information sur la date du jour **/
    var maintenant = new Date();
    var ce_mois = maintenant.getMonth();
    var ce_annee = maintenant.getFullYear();
    var ce_jour = N_jours[maintenant.getDay()];
    
    /** Nombre de jours de ce mois **/
    var nb_jours_mois = NbJoursMois(mois,annee);
    /** Compteur du nombre de jour dans la semaine **/
    var jours_par_semaine = 1;
    /** Compteur permettant d'insérer le numéro du jour dans le calendrier et de repérer la fin du mois **/
    var jours = 1;
    /** Compteur du nombre de blancs à laisser avant de commencer */
    var nb_blancs = NbBlancs(mois,annee);
    /* Les mois d'avants et d'après */
    var mois_avant = mois-1;
    var mois_apres = mois+1;
    var annee_avant = annee;
    var annee_apres = annee;
    if(mois==1)
    {
    	mois_avant = 12;
    	annee_avant = annee-1;
    }
    if(mois==12)
    {
    	mois_apres = 1;
    	annee_apres = annee+1;
    }
    
    var htm ="<table>";
    htm +="<tr>";
    htm +='<th style="cursor:pointer;" onClick="calendrier('+mois_avant+','+annee_avant+','+(affiche.id)+');"> < </th>';
    htm +="<th colspan=5>"+N_mois[mois-1]+" "+annee+"</th>";
    htm +='<th style="cursor:pointer;" onClick="calendrier('+mois_apres+','+annee_apres+','+(affiche.id)+');"> > </th>';
    htm +="</tr>";
    htm +="<tr>";
    htm +="<td>Lu</td><td>Ma</td><td>Me</td><td>Je</td><td>Ve</td><td>Sa</td><td>Di</td>";
    htm +="</tr>";
    htm +="<tr>";
    
    /*debut du tableau : on laisse certaines cases vides*/
    while(nb_blancs>0) /* Décompte du nombre de blancs*/
    {
    	htm +="<td></td>"; /*on saute une case*/
    	nb_blancs--;; /*on décrémente le nombre de blancs*/
    	jours_par_semaine++; /*on incrémente le compteur du nombre de jours dans une semaine*/
    }
    
    /*Partie principale du tableau*/
    while(jours <= nb_jours_mois) /*Tant que l'on a pas dépassé le nombre de jours du mois courant*/
    {
    	htm += '<td style="cursor:pointer" >'+jours+'</td>'; /* on construit et remplit une case avec le numéro du jour*/
    	jours++; /* on passe au jour suivant*/
    	jours_par_semaine++; /* on incrémente le compteur du nombre de jours dans une semaine*/
    	if (jours_par_semaine > 7) /*On teste si le compteur  du nombre de jours dans une semaine est arrivé à son maximum*/
    	{
    		htm += "</tr><tr>"; /*si oui, on finit la ligne du tableau et on e commence une nouvelle*/
    		jours_par_semaine = 1; /*puis on remet le compteur du nombre de jours dans une semaine à sa valeur minimale 1*/
    	}
    	/*Sinon, on ne fait rien ici*/
    }
    /*Fin du tableau : on laisse la fin des cases vides*/
    	while (jours_par_semaine >1 && jours_par_semaine <=7)
    	{
    		htm += "<td></td>"; /* on met une case vide*/
    		jours_par_semaine++; /*On incémente le compteur du nombre de jours dans une semaine une dernière fois*/
    	}
    
    /*fin de la construction du tableau*/
    htm += "</tr></table>";
    
    
    affiche.innerHTML=htm;
    affiche.style.visibility="";
    
    }
    et c'est quand j'insère cela dans la ligne en gras souligné :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    onClick="EcrireDate('+jours+','+mois+','+annee+','+(ecrire.id)+');"
    que le claendrier ne veut plus fonctionner. Par contre la date s'insère correctement dans mon champ.

    Merci beaucoup d'avance pour votre aide.

  5. #5
    Membre averti
    Profil pro
    Inscrit en
    Novembre 2004
    Messages
    17
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Novembre 2004
    Messages : 17
    Par défaut J'ai trouvé
    Je suis désolé d'avoir poster trop vite j'ai trouvé mon erreur en cherchant autre chose !!
    En fait j'ai rajouter un paramètre à ma fonction calendrier "ecrire" et je ne l'ai pas répercuter dans les ligns <th> de mon tableau.

    Je sais pas si je suis clair. mais bon.

    Il ne reste plus qu'à s'attaquer au css et après ce sera fini !!

Discussions similaires

  1. Champ nommé "Date"
    Par Rakken dans le forum Administration
    Réponses: 5
    Dernier message: 16/11/2006, 14h08
  2. [MySQL] Qu'est-ce que je risque avec un champ nommé 'date' ?
    Par JackBeauregard dans le forum PHP & Base de données
    Réponses: 5
    Dernier message: 07/11/2006, 15h45
  3. Requete sur champ de date
    Par cryptorchild dans le forum MS SQL Server
    Réponses: 1
    Dernier message: 25/09/2006, 16h45
  4. Réponses: 2
    Dernier message: 13/06/2006, 07h27
  5. Champs de date
    Par Romalafrite dans le forum MS SQL Server
    Réponses: 9
    Dernier message: 01/07/2004, 18h17

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo