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 :

Ajouter 15 mois à une date


Sujet :

JavaScript

  1. #1
    Nouveau membre du Club
    Profil pro
    Inscrit en
    septembre 2012
    Messages
    57
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : septembre 2012
    Messages : 57
    Points : 26
    Points
    26
    Par défaut Ajouter 15 mois à une date
    bonjour à tous ,

    voila , je suis plus que débutant en js , et je n'arrive pas à mettre en oeuvre quelques choses qui ne doit pas être bien compliqué :

    je m'explique :

    j'ai un champ input dans un formulaire ( date_debut ) qui l'on remplit via datepicker .

    j'ai un autre input (date_fin) ou je souhaiterais insérer la date sélectionné dans input date_debut , y rajouté 15 mois et l'affiché dans date_fin .

    j'arrive à affiché la même date dans le input date_fin , maintenant je souhaiterais lui rajouter 15 mois .....;

    voila j'espère avoir été clair dans mes propos ....

    merci pour votre aide

    voila le code

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    <input id="M1" class="datepicker" type="text" name="date_debut"  value="" onchange="javascript:document.getElementById('M2').value=this.value;"><br>
     
    <input id="M2" class="mandat" type="text" name="date_fin"  value="" ><br>

  2. #2
    Membre expérimenté

    Homme Profil pro
    linux, pascal, HTML
    Inscrit en
    mars 2002
    Messages
    641
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 70
    Localisation : Belgique

    Informations professionnelles :
    Activité : linux, pascal, HTML
    Secteur : Enseignement

    Informations forums :
    Inscription : mars 2002
    Messages : 641
    Points : 1 451
    Points
    1 451
    Billets dans le blog
    1
    Par défaut
    en javascript, c'est assez simple
    L'astuce consiste à ajouter directement 15 mois au numero du mois actuel
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    var d=new Date(); // date du jour
    var m=d.getMonth()+15;
    d.setMonth(m);
    //on vérifie sachant qu'on part de la date actuelle
    console.log(d);

  3. #3
    Nouveau membre du Club
    Profil pro
    Inscrit en
    septembre 2012
    Messages
    57
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : septembre 2012
    Messages : 57
    Points : 26
    Points
    26
    Par défaut
    bonjour et merci pour ta réponses .

    ça à l'air simple comme ça ;-) ....

    ma difficulté , c'est associé ton code avec la valeur saisi dans input date_debut ....

    je ne sais pas comment récupérer la valeur " this.value " pour lui rajouter les 15 mois ....

  4. #4
    Rédacteur/Modérateur
    Avatar de ProgElecT
    Homme Profil pro
    Retraité
    Inscrit en
    décembre 2004
    Messages
    4 986
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 63
    Localisation : France, Haute Savoie (Rhône Alpes)

    Informations professionnelles :
    Activité : Retraité
    Secteur : Communication - Médias

    Informations forums :
    Inscription : décembre 2004
    Messages : 4 986
    Points : 11 618
    Points
    11 618
    Par défaut
    Salut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    var dateRepondu=new Date(document.getElementById("date_debut").value);
    Motif de l'édit:
    Il fallait faire
    var dateRepondu=new Date(document.getElementsByName(""date_debut").value); ou var dateRepondu=new Date(document.getElementById("M1").value);
    ProgElecT
    Soyez sympa, pensez -y
    Balises[CODE]...[/CODE]
    Balises[CODE=NomDuLangage]...[/CODE] quand vous mettez du code d'un autre langage que celui du forum ou vous postez.
    Le bouton en fin de discussion, quand vous avez obtenu l'aide attendue.
    ......... et pourquoi pas, pour remercier, un pour celui/ceux qui vous ont dépannés.

  5. #5
    Membre expert
    Avatar de javatwister
    Homme Profil pro
    danseur
    Inscrit en
    août 2003
    Messages
    2 940
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Calvados (Basse Normandie)

    Informations professionnelles :
    Activité : danseur

    Informations forums :
    Inscription : août 2003
    Messages : 2 940
    Points : 3 826
    Points
    3 826
    Par défaut
    Essaie ça, d'après le code de Michel:

    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    document.getElementById("M1").addEventListener("change",(e) => {
     
    	var d=new Date(e.target.value); // date de "M1"
    	var m=d.getMonth()+15;
    	d.setMonth(m);
    	// affectation de la date augmentée à "M2"
    	document.getElementById("M2").value=Intl.DateTimeFormat({day:"numeric",month:"numeric",year:"numeric"}).format(d);
    },
    false)

    Ce qui suppose que tu enlèves ton événement onchange de la balise "M1";

  6. #6
    Nouveau membre du Club
    Profil pro
    Inscrit en
    septembre 2012
    Messages
    57
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : septembre 2012
    Messages : 57
    Points : 26
    Points
    26
    Par défaut
    merci ,

    je test cela et reviens vers vous ....

    je n'avais pas vu le message en dessous de ton code javatwister
    ......

    c'est bon cela fonctionne impecc !!!!!!

    merci beaucoup pour votre aide ......

    c'est donc résolu

  7. #7
    Membre expert
    Avatar de javatwister
    Homme Profil pro
    danseur
    Inscrit en
    août 2003
    Messages
    2 940
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Calvados (Basse Normandie)

    Informations professionnelles :
    Activité : danseur

    Informations forums :
    Inscription : août 2003
    Messages : 2 940
    Points : 3 826
    Points
    3 826
    Par défaut
    Oui, c'est pourquoi je t'ai donné l'unique code à insérer... en enlevant l'appel de fonction dans la balise.

  8. #8
    Nouveau membre du Club
    Profil pro
    Inscrit en
    septembre 2012
    Messages
    57
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : septembre 2012
    Messages : 57
    Points : 26
    Points
    26
    Par défaut
    c'est encore moi , alors cela ne fonctionne pas tout le temps ....

    je pense que le choix de la date par datepicker n'aide pas ....

    quand je rentre une date via date picker , cela ne fonctionne pas

    si je la rentre manuellement comme ça 03/10/2019 dans le M1 , il me met ça 10/06/2020 dans M2 .....

    et si je mets 03/06/2019 dans M1 , j'ai ce résultat dans M2 06/06/2020

    bizarre non ?

    Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    		<input id="M1" class="datepicker" type="text" name="date_debut"  value="" ><br>
                    <input id="M2" class="mandat" type="text" name="date_fin"  value="" ><br>
     
            <script>
                            document.getElementById("M1").addEventListener("change",(e) => {
     
                            var d=new Date(e.target.value); // date de "M1"
                            var m=d.getMonth()+15;
                            d.setMonth(m);
                            // affectation de la date augmentée à "M2"
                            document.getElementById("M2").value=Intl.DateTimeFormat({day:"numeric",month:"numeric",year:"numeric"}).format(d);
                            },
                            false)
                    </script>

  9. #9
    Membre expert
    Avatar de javatwister
    Homme Profil pro
    danseur
    Inscrit en
    août 2003
    Messages
    2 940
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Calvados (Basse Normandie)

    Informations professionnelles :
    Activité : danseur

    Informations forums :
    Inscription : août 2003
    Messages : 2 940
    Points : 3 826
    Points
    3 826
    Par défaut
    Ben non, c'est le format anglais...

  10. #10
    Nouveau membre du Club
    Profil pro
    Inscrit en
    septembre 2012
    Messages
    57
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : septembre 2012
    Messages : 57
    Points : 26
    Points
    26
    Par défaut
    d'accord, mais il n'y a pas 15 mois entre les date ?

    et pourquoi d'après toi cela ne fonctionne pas avec datepicker

    encore merci pour ton aide

  11. #11
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    janvier 2011
    Messages
    13 932
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : janvier 2011
    Messages : 13 932
    Points : 34 200
    Points
    34 200
    Par défaut
    Bonjour,
    Citation Envoyé par anti91
    et pourquoi d'après toi cela ne fonctionne pas avec datepicker
    et si tu nous indiquais le « datepicker » que tu utilises !

  12. #12
    Membre expert
    Avatar de javatwister
    Homme Profil pro
    danseur
    Inscrit en
    août 2003
    Messages
    2 940
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Calvados (Basse Normandie)

    Informations professionnelles :
    Activité : danseur

    Informations forums :
    Inscription : août 2003
    Messages : 2 940
    Points : 3 826
    Points
    3 826
    Par défaut
    Citation Envoyé par anti91 Voir le message
    d'accord, mais il n'y a pas 15 mois entre les date ?
    Dans tes 2 exemples, si!

  13. #13
    Nouveau membre du Club
    Profil pro
    Inscrit en
    septembre 2012
    Messages
    57
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : septembre 2012
    Messages : 57
    Points : 26
    Points
    26
    Par défaut
    alors je te confirme que,les dates donné ne font pas 15 mois .....ou alors je ne sais plus compter ...

    et voila le datepicker que j'utilise :

    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
     = js
     
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    <script type="text/javascript">
    $.datepicker.setDefaults(
        {
            altField: "#datepicker",
            closeText: 'Fermer',
            prevText: 'Précédent',
            nextText: 'Suivant',
            currentText: 'Aujourd\'hui',
            monthNames: ['Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Décembre'],
            monthNamesShort: ['Janv.', 'Févr.', 'Mars', 'Avril', 'Mai', 'Juin', 'Juil.', 'Août', 'Sept.', 'Oct.', 'Nov.', 'Déc.'],
            dayNames: ['Dimanche', 'Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi'],
            dayNamesShort: ['Dim.', 'Lun.', 'Mar.', 'Mer.', 'Jeu.', 'Ven.', 'Sam.'],
            dayNamesMin: ['D', 'L', 'M', 'M', 'J', 'V', 'S'],
            weekHeader: 'Sem.',
            dateFormat: 'dd/mm/yy'
        }
    );
     
    </script>
     
        <script type="text/javascript">
      $( function() {
        $( ".datepicker" ).datepicker({
          changeMonth: true,
          changeYear: true
        });
      } );
      </script>

  14. #14
    Nouveau membre du Club
    Profil pro
    Inscrit en
    septembre 2012
    Messages
    57
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : septembre 2012
    Messages : 57
    Points : 26
    Points
    26
    Par défaut
    Citation Envoyé par javatwister Voir le message
    Dans tes 2 exemples, si!
    03/10/2019 -> 10/06/2020 = 9 mois et qq jours

    03/06/2019 -> 06/06/2020 = 12 mois et qq jours

  15. #15
    Membre expert
    Avatar de javatwister
    Homme Profil pro
    danseur
    Inscrit en
    août 2003
    Messages
    2 940
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Calvados (Basse Normandie)

    Informations professionnelles :
    Activité : danseur

    Informations forums :
    Inscription : août 2003
    Messages : 2 940
    Points : 3 826
    Points
    3 826
    Par défaut
    Ce que tune comprends pas c'est la lecture à l'anglaise, oû le mois précède le jour.

  16. #16
    Expert confirmé Avatar de psychadelic
    Profil pro
    Inscrit en
    mai 2010
    Messages
    2 405
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : mai 2010
    Messages : 2 405
    Points : 4 648
    Points
    4 648
    Par défaut
    Citation Envoyé par anti91 Voir le message
    je pense que le choix de la date par datepicker n'aide pas ....
    en HTML5 on peut utiliser des <input type="date",
    exemple
    Code HTML : 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
    <!DOCTYPE html>
    <html lang="fr">
    <head>
      <meta charset="UTF-8">
      <title>.</title>
    </head>
    <body>
      <form action="xxx" id="my-Form">
        date dèbut : <input type="date" name="dateDeb"> 
        date Fin :     <input type="date" name="dateFin">
      </form>
      <script>
        const myForm = document.querySelector('#my-Form')
     
        // 1: local date  values, time = 0
        const sysDate   = new Date()  
            , localDate = new Date(Date.UTC( sysDate.getFullYear(), sysDate.getMonth(), sysDate.getDate()
                                           , sysDate.getHours(), sysDate.getMinutes(), 0) )
     
        function Plus_15_mois(D)
          {
          if (D instanceof Date)  // D is a valid date
            {
            let R = new Date(D.getTime())
            R.setMonth(R.getMonth()+15)
            return R
            }
          else return localDate // sinon // return null
          } 
     
        // initialization des dates au chargement de la page
        myForm.dateDeb.valueAsDate = localDate
        myForm.dateFin.valueAsDate = Plus_15_mois(localDate) 
     
        myForm.dateDeb.onchange =_=>
          {
          myForm.dateFin.valueAsDate = Plus_15_mois(myForm.dateDeb.valueAsDate) 
          }
      </script>
    </body>
    </html>
    , c'est quand même plus ""simple"" non ?


    Sinon des datePicker il y en a des milliers ( https://github.com/search?l=JavaScri...e=Repositories )

    Je ne sais pas lequel tu utilises, mais visiblement il à l'air pourri !

    le plus populaire étant https://amsul.ca/pickadate.js/date/ très complet!
    «La pluralité des voix n'est pas une preuve, pour les vérités malaisées à découvrir, tant il est bien plus vraisemblable qu'un homme seul les ait rencontrées que tout un peuple.» [ René Descartes ] - Discours de la méthode

  17. #17
    Nouveau membre du Club
    Profil pro
    Inscrit en
    septembre 2012
    Messages
    57
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : septembre 2012
    Messages : 57
    Points : 26
    Points
    26
    Par défaut
    Citation Envoyé par javatwister Voir le message
    Ce que tune comprends pas c'est la lecture à l'anglaise, oû le mois précède le jour.
    Ah ok, milles excuses , je n'avais pas compris cela .....

    merci

  18. #18
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    janvier 2011
    Messages
    13 932
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : janvier 2011
    Messages : 13 932
    Points : 34 200
    Points
    34 200
    Par défaut
    @psychadelic :
    en HTML5 on peut utiliser des <input type="date",
    Tout à fait d'accord mais le rendu d'affichage est vraiment très différent d'un navigateur à l'autre, pour ceux qui le prennent en compte. Bon d'un autre côté les « navigateurs obsolètes » deviennent de plus en plus rares.

    Je ne sais pas lequel tu utilises, mais visiblement il à l'air pourri !
    C'est le datepicker de jQuery UI, d'après les scripts chargés.

    le plus populaire étant https://amsul.ca/pickadate.js/date/ très complet!
    Sur gitHub uniquement, car il y celui de jQuery UI et celui de BootStrap qui sont très utilisés



    @anti91 :
    Comment peux-tu avoir les deux formats de date dans le même code source ?

    Si tu utilises le datepicker de jQuery UI alors pourquoi ne pas l'utiliser correctement et notamment l'option onClose ?
    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
    $(function() {
        $(".datepicker").datepicker({
            changeMonth: true,
            changeYear: true,
            onClose: function(date, inst) {
                // pour tout savoir sur
                console.log(inst);
                // efface résultat
                $("#M2").val("");
                // calcul date fin
                if (date) {
                    // récup. de la date
                    let laDate = inst.input.datepicker("getDate");
                    console.log("Date début :", laDate);
                    // ajout de 15 mois
                    laDate.setMonth(laDate.getMonth() + 15);
                    console.log("Date après :", laDate);
                    // formattage de la date
                    laDate = Intl.DateTimeFormat({
                        day: "numeric",
                        month: "numeric",
                        year: "numeric"
                    }).format(laDate);
                    // affiche résultat
                    $("#M2").val(laDate);
                }
            }
        });
    });
    C'est sûrement à améliorer et tu peux supprimer tous les console.log().

    Il te faut bien sûr virer les événements placés directement dans les balises, sous peine de surprise.
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    <input id="M1" class="datepicker" type="text" name="date_debut"  value="">
    <input id="M2" class="mandat" type="text" name="date_fin"  value="">

    Nota : J'espère que tu n'utilises pas jQuery uniquement pour le datePicker !

Discussions similaires

  1. Rajouter 6 mois à une date
    Par Le Maraud dans le forum Langage
    Réponses: 4
    Dernier message: 11/12/2009, 21h21
  2. ajouter 8 mois à une date
    Par Myfred dans le forum Général JavaScript
    Réponses: 16
    Dernier message: 07/03/2007, 12h35
  3. Requête Access 2003 : Ajouter 6 mois à une date
    Par billy123 dans le forum Requêtes et SQL.
    Réponses: 4
    Dernier message: 28/02/2007, 17h26
  4. [Dates] Ajouter un mois à une date
    Par Higestromm dans le forum Langage
    Réponses: 8
    Dernier message: 17/01/2006, 16h27
  5. ajouter 1 mois à une date dans une requete
    Par alain.lc dans le forum PostgreSQL
    Réponses: 6
    Dernier message: 04/04/2005, 13h05

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