how to restrict bootstrap date picker from future date

Question

I want to restrict the date picker of bootstrap from taking future date.I just want to enable the dates up to today only.How can i achieve this.

Here is my code

<script>
  var FromEndDate = new Date();

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

Can any body help regarding this

Answer 1

Here is a demo of a working solution:

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

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

edit: the version of Bootstrap Datepicker that supports startDate and endDate is here: https://github.com/eternicode/bootstrap-datepicker

The original project, which is the current top search result for the plugin, does not have that feature at this time: http://www.eyecon.ro/bootstrap-datepicker/

Answer 2

Set endDate property to +0d

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

FIDDLE

Answer 3

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

Adding this to your js user can only select date upto today's date and user cannot enter custom date value manually to the input element. If user enters a custom value then it will automatically change to the current date

Answer 4

Try this,

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

I used date picker from Git

Demo

Answer 5

This code worked for me..

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

Answer 6

Due to issue in plugin it is getting happened use this datepicker.js

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

Answer 7

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

Answer 8

You can do it using the option endDate. All the dates after the date specified in endDate option are disabled. If you want to disable dates after today use this in your input tag:

<input type="text" data-provide="datepicker" data-date-end-date="0d">

Source: https://bootstrap-datepicker.readthedocs.io/en/stable/options.html#id5

Answer 9

Non of the above solutions work for me. After alot of searching and debugging finally I fix it. I am sharing my solution below, If someone like me facing the same problem can try the following solution.

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');

Answer 10

Try this:

var date=new Date();
$('#datetimepicker').datetimepicker({
    format: 'MM/dd/yyyy',
    language: 'en',
    startDate : new Date('2015-01-01'),
    endDate :  date
});