web-dev-qa-db-fra.com

comment restreindre le sélecteur de date bootstrap à partir de la date future

Je veux limiter le sélecteur de date de bootstrap de prendre la date future.Je veux juste activer les dates à ce jour seulement.Comment puis-je y parvenir?.

Voici mon code

<script>
  var FromEndDate = new Date();

    $(function(){
   $('.datepicker').datepicker({
      format: 'mm-dd-yyyy',
     endDate: FromEndDate, 
    autoclose: true
    });
});
</script>

Tout corps peut-il aider à ce sujet

jquerytwitter-bootstrapdatepickerbootstrap-datepicker
17
user2142786

Voici une démonstration d'une solution qui fonctionne:

http://jsfiddle.net/tjnicolaides/cjp7y/

<script>
$(function(){
    $('.datepicker').datepicker({
        format: 'mm-dd-yyyy',
        endDate: '+0d',
        autoclose: true
    });
});
</script>

edit: la version de Bootstrap Datepicker qui prend en charge startDate et endDate est ici: https://github.com/eternicode/bootstrap-datepicker

Le projet d'origine, qui correspond au résultat de recherche actuel le plus récent du plug-in, n'a pas cette fonctionnalité pour le moment: http://www.eyecon.ro/bootstrap-datepicker/

40
TJ Nicolaides

Définissez la propriété endDate sur +0d

<script> 
    $(function() {
        $('.datepicker').datepicker({
            format: 'mm-dd-yyyy',
            endDate: '+0d',
            autoclose: true
        });
    });
</script>

FIDDLE

20
Pranav C Balan
$(document).ready(function(){
$(".datepicker").datepicker({
     endDate:'today'
    });
});

En ajoutant ceci à votre utilisateur js , Vous ne pouvez sélectionner que la date jusqu'à la date du jour et l'utilisateur ne peut pas entrer la valeur de date personnalisée manuellement pour l'élément d'entrée. Si l'utilisateur entre une valeur personnalisée, il passera automatiquement à la date actuelle

4
KATJ Srinath

Ce code a fonctionné pour moi ..

$('#txtTo').datepicker({
            dateFormat: "dd/MM/yy",
            changeMonth: true,
            changeYear: true,
         ignoreReadonly: true,
            maxDate: 'now'
        });
    });
3
Nithya

Essaye ça,

$(function () {
    $('.datepicker').datepicker({
        format: 'mm-dd-yyyy',
        endDate: '+0d',
        autoclose: true
    });
});

J'ai utilisé sélecteur de date de Git

Démo

3
Rohan Kumar
$(function(){
$('.datepicker').datepicker({
      format: 'mm-dd-yyyy',
      onRender:function(date){
      return date.valueOf() > FromEndDate.valueOf()?'disabled':'';
      }
   });
});
1
Rachel

En raison d'un problème dans le plugin, il commence à se passer, utilisez ce datepicker.js

http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.2.0/js/bootstrap-datepicker.js

1
user2142786

Aucune des solutions ci-dessus ne fonctionne pour moi. Après beaucoup de recherches et de débogage, je le répare enfin. Je partage ma solution ci-dessous, si une personne comme moi confrontée au même problème peut essayer la solution suivante.

        var now = new Date();
        $('[name=depdate]').datepicker({
            format: 'yyyy-mm-dd',
            onRender: function(date) {
                if(date.valueOf() > now.addDays(15).valueOf()) {
                    return 'disabled';
                } else if(date.valueOf() < now.valueOf()) {
                    return 'disabled';
                }
            }
        })
        .on('changeDate', function(){
            $(this).datepicker('hide');
        }).data('datepicker');
0
MasoodUrRehman