web-dev-qa-db-fra.com

y a-t-il un sélecteur d'année déroulante jQuery

existe-t-il un plugin jQuery qui crée automatiquement un sélecteur d'année déroulante (c'est-à-dire un élément "select" peuplé avec toutes les années à partir de l'année en cours et d'une année donnée)?

Je n'ai pas besoin de jour/mois (sinon j'aurais utilisé le sélecteur de date), j'ai juste besoin de l'année!

Merci d'avance

jqueryjquery-plugins
19
Nicola Peluchetti

Qu'en est-il juste:

<select name="yearpicker" id="yearpicker"></select>

Et alors:

for (i = new Date().getFullYear(); i > 1900; i--)
{
    $('#yearpicker').append($('<option />').val(i).html(i));
}
54
Jimmy Sawczuk

Enveloppant le code dans le plugin jQuery pour sélectionner les années entre le début et la fin de l’année:

jQuery.extend(jQuery.fn,{

    /*
    ** Year selection plugin
    ** Sample usage
    ** $('#yearpicker').years(2007, 2017);
    **
    ** HTML
    ** <select name="yearpicker" id="yearpicker"></select>
    */
    years: function(start, end) {
        for (i = start; i <= end; i++)
        {
            $(this).append($('<option />').val(i).html(i));
        }
    }
});
3
VLADISLAV BOGOMOLNY

Développer la solution de Jimmy Sawczuk - et si vous deviez également traiter des données de retour d'informations dans une page de formulaire où une sélection précédente devait être chargée/sélectionnée.

Une variable contenant la sélection précédente de l'utilisateur peut être utilisée dans une instruction if pour affecter dynamiquement l'attribut "Sélectionné" comme suit:

for (i = new Date().getFullYear(); i > 1900; i--)
{
 if(userselection == i){
 $('#yearpicker').append($('<option />').val(i).attr("selected","selected").html(i));
 } else {    
 $('#yearpicker').append($('<option />').val(i).html(i));
 }
}
2
Martin Sansone - MiOEE

datepicker a l'option minViewMode. Dans mon cas, je l'ai utilisé pour les plages de dates en années:

JavaScript: $ ('. Input-daterange'). Datepicker ({ MinViewMode: 2, Format: 'yyyy [}]);

HTML:

<div class="input-daterange date"id="DataRange">
  <input type="text"class="input-small"/>
    <span class="add-on">to</span>
  <input type="text"class="input-small"/>
</div>
0
mmv_sat