131 votes

Afficheur de date Bootstrap - Mois et années uniquement

J'utilise un datepicker bootstrap et mon code est le suivant, Démo 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 ce que j'essaie de faire est de permettre aux utilisateurs de choisir les mois et les années uniquement.

Pourriez-vous me dire comment faire ?

303voto

Iswanto San Points 7499

Que pensez-vous de ceci :

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

Référence : Datepicker pour Bootstrap


Pour les versions 1.2.0 et plus récentes, viewMode est devenu startView alors utilisez :

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

Voir aussi la documentation .

8voto

Liber Points 141

Remarquez que dans la version de 1.2.0, la fonction viewMode est devenu startView .

eg :

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

http://eternicode.github.io/bootstrap-datepicker/?markup=component&format=yyyy&weekStart=&startDate=&endDate=&startView=2&minViewMode=2&todayBtn=false&language=zh-CN&orientation=auto&autoclose=on&forceParse=on#sandbox

4voto

Tanya Points 237

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

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

3voto

Sheharyar Points 2063

Pour les dernières bootstrap-datepicker (1.4.0 au moment de la rédaction), vous devez utiliser ceci :

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

Source : Options du Datepicker Bootstrap

1voto

J'utilise un calendrier bootstrap pour les dates futures qui ne permet pas de modifier les mois et l'année.

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()
        });

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X