In this article, we will explain to you how to disable past dates in bootstrap Datepicker(Bootstrap Datepicker Disable Past Dates Example).
Here, in this example, we will disable the past dates using the startDate parameter. so you can see the below example.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 | <!DOCTYPE html> <html> <head> <title>Bootstrap Datepicker Disable Past Dates Example - XpertPhp</title> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/css/bootstrap-datepicker.min.css" rel="stylesheet"/> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/js/bootstrap-datepicker.min.js"></script> </head> <body> <div class="container"> <div class="row"> <div class='col-lg-6'> <div class="form-group"> <div class='input-group date' id='datepicker1'> <input type='text' class="form-control" /> <span class="input-group-addon"> <span class="glyphicon glyphicon-calendar"></span> </span> </div> </div> </div> <script type="text/javascript"> $(function () { var date = new Date(); date.setDate(date.getDate()-1); $('#datepicker1').datepicker({ startDate: date, }); $('#datepicker1').datepicker("setDate", new Date()); }); </script> </div> </div> </body> </html> |