Partage
  • Partager sur Facebook
  • Partager sur Twitter

DatePicker et insertion d'options

Comment modifier ou insérer des options dans un tableau d'option java

    11 février 2024 à 22:49:20

    Bonjour, encore une question sur datepicker (api jquery) je cherche le moyen une fois le tableau d'option défini à rajouter une option.

    Je vais essayer de m'expliquer à l'initialisation de mon datepicker j'ai de base un certain nombre d'options défini, j'ai besoin d'en rajouter une via javascript une fois ces options définies, j'ai trouvé quelques post mais je n'arrive pas à les faire fonctionner..

    https://api.jqueryui.com/datepicker/#option-minDate

    Code examples:
    Initialize the datepicker with the minDate option specified:
    
    $( ".selector" ).datepicker({
      minDate: new Date(2007, 1 - 1, 1)
    });
    Get or set the minDate option, after initialization:
    
    // Getter
    var minDate = $( ".selector" ).datepicker( "option", "minDate" );
     
    // Setter
    $( ".selector" ).datepicker( "option", "minDate", new Date(2007, 1 - 1, 1) );

    pour l'exemple et voici mon code :

    $('#datepickerDebut').datepicker(datepickerOptions2);
    
    var datepickerOptions2 = {
      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'],
      dateFormat: 'dd-mm-yy',
      prevText: 'Précédent',
      nextText: 'Suivant',
      firstDay: 1,
      showOn: "both",
      buttonText: "Choisir la date",
      buttonImage: "/images/datepicker3.gif",
      maxDate:"date()"
    
    };
    

    et dans la page php :

    										
    <fieldset>											 
       <label for="datepickerDebut">
    
    <?php 											 
          echo "Date du jour à modifier : &nbsp;"; 
    
    ?> 											
    
    											 
      </label>
    
    									   											 
      <input type="text" id="datepickerDebut" name="datepicker" minlength="10" maxlength="10" value ="<?php echo "dd-mm-aaaa"?>" 
    
    							title="Le format à respecter est dd-mm-aaaa"  >
    
    									   																	
    </fieldset>



    <script>
    
    $('.datepickerDebut').datepicker('datepickerOptions2', 'minDate', '01-01-2024');
    
     var maxDate = $('.datepickerDebut').datepicker('datepickerOptions2', 'maxDate');
    
     console.log(maxDate);	
    	
    
    
    </script>



    le var maxDate est juste là pour voir si la fonction pour connaitre la position est opérationnel , rien ne s'affiche dans la console et bien entendu ma date minimale n'est pas prise en compte non plus..

    J'ai essayé pas mal de syntaxe sur le rajout de l'option minDate sans succès; si je remet dans ma page l'ensemble des options en rajoutant minDate cela fonctionne.

    Ce que je cherche c'est donc le moyen de rajouter une option dans le tableau des options sans toutes le redéfinir, cela semble possible au vu du post dont j'ai mis le lien mais moi....

    Merci

    • Partager sur Facebook
    • Partager sur Twitter
      12 février 2024 à 12:25:35

      Salut

      Au debut ton selecteur datePickerDebut est un id(#), ensuite c'est une classe (.). Le probleme vient peut etre de la

      Ensuite dans tes getters/setters il faut "option" en premier parametre

      -
      Edité par thetui 12 février 2024 à 12:27:05

      • Partager sur Facebook
      • Partager sur Twitter
        12 février 2024 à 14:09:02

        thetui a écrit:

        Salut

        Au debut ton selecteur datePickerDebut est un id(#), ensuite c'est une classe (.). Le probleme vient peut etre de la

        Ensuite dans tes getters/setters il faut "option" en premier parametre

        -
        Edité par thetui il y a environ 1 heure


        Merci, si j'ai bien tout compris (pas sur vu mon niveau sur le sujet..)

        J'ai testé avec '.datepickerDebut' puis '#datepickerDebut' avec les guillemets simple et double aussi..

        avec le point (la classe) j'obtiens ceci dans la console :

        avec le # (ID) j'obtiens ceci :

        Ensuite pour cette histoire de 1er paramètre je suppose que tu veux parler de ce que j'ai mis en gras

        var maxDate = $(".datepickerDebut").datepicker("datepickerOptions2", "dateFormat");

        J'ai essayé en mettant option au lieu de datepickerOptions2 cela ne change rien et je penses (peut-être à tort) que comme j'ai défini mes options sous le nom var datepickerOptions2 c'était celui-ci que je devait mettre

        Merci

        • Partager sur Facebook
        • Partager sur Twitter
          13 février 2024 à 10:02:45

          Vu que tu declare l'element html avec un id tu le selectionnes avec #id, ensuite pour len parametre en gras c'est bien option.

          Ca donne

          $('#datepickerDebut').datepicker('option', 'minDate', '01-01-2024');
          console.log($('#datepickerDebut').datepicker('option', 'minDate'));



          • Partager sur Facebook
          • Partager sur Twitter
            13 février 2024 à 14:09:04

            Merci, cela fonctionne nickel (il m'avait pour temps sembler avoir tester cette syntaxe...J'avais surement dû oublié de rafraichir le code javascript...)

            Mais dans les bizarreries le fait de rajouter une option (pas forcement minDate, j'ai testé aussi avec appendText)

            La valeur par défaut du champ input text est recontrôlée et si ce n 'est pas une chaine de format 01-02-2024 (par exemple ) mais la valeur par défaut que je souhaitais mettre dd-mm-aaaa cela ne s'affiche plus...

            Merci encore

            • Partager sur Facebook
            • Partager sur Twitter

            DatePicker et insertion d'options

            × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
            • Editeur
            • Markdown