web-dev-qa-db-fra.com

Bootstrap Datepicker - Mois et années uniquement

J'utilise bootstrap datepicker et mon code est comme suit, démonstration du code sur jsfiddle

<div class="input-append date" id="datepicker" data-date="02-2012" 
     data-date-format="mm-yyyy">

 <input  type="text" readonly="readonly" name="date" >    
 <span class="add-on"><i class="icon-th"></i></span>      
</div>      


$("#datepicker").datepicker({
        viewMode: 'years',
         format: 'mm-yyyy'
    });

Le code ci-dessus fonctionne bien, mais j'essaie de permettre aux utilisateurs de choisir des mois et des années seulement.

Pourriez-vous s'il vous plaît me dire comment faire cela?

111
black_belt

Que dis-tu de ça :

$("#datepicker").datepicker( {
    format: "mm-yyyy",
    viewMode: "months", 
    minViewMode: "months"
});

Référence: Datepicker for Bootstrap


Pour la version 1.2.0 et ultérieure, viewMode a été remplacé par startView, utilisez donc:

$("#datepicker").datepicker( {
    format: "mm-yyyy",
    startView: "months", 
    minViewMode: "months"
});

Voir aussi la documentation .

252
Iswanto San

Notez que dans la version 1.2.0, la viewMode a été remplacée par startView.

par exemple:

$('#sandbox-container input').datepicker({
  startView: 1,
  minViewMode: 1
});

bac à sable

6
Liber

J'utilise la version 2 (supporte à la fois bootstrap v2 et v3) et cela fonctionne pour moi:

$("#datepicker").datepicker( {
    format: "mm/yyyy",
    startView: "year", 
    minView: "year"
});
3
Tanya

Pour le dernier bootstrap-datepicker _ (1.4.0 au moment de l'écriture), vous devez utiliser ceci:

$('#myDatepicker').datepicker({
    format: "mm/yyyy",
    startView: "year", 
    minViewMode: "months"
})

Source: Options de l'option Datepicker de Bootstrap

3
Sheharyar

J'utilise le calendrier bootstrap _ pour les dates futures, mais pas pour permettre les changements de mois et d'année uniquement.

var j = jQuery.noConflict();
        j(function () {
            j(".datepicker").datepicker({ dateFormat: "dd-M-yy" }).val()
        });

        j(function () {
            j(".Futuredatenotallowed").datepicker({
                changeMonth: true,
                maxDate: 0,
                changeYear: true,
                dateFormat: 'dd-M-yy',
                language: "tr"
            }).on('changeDate', function (ev) {
                $(this).blur();
                $(this).datepicker('hide');
            }).val()
        });
1

Vous ne devriez avoir à ajouter que minViewMode: "months" dans votre fonction sélecteur de date.

1
Nisarg Bhavsar