Bootstrap datepicker disabling past dates without current date

Question

I wanted to disable all past date before current date  not with current date  I am trying by bootstrap datepicker library  bootstrap-datepicker  and using following code       date   datepicker        startDate  new Date          It works fine  But it is disabling date till today    As example if today is 04-20-2013 and i disable past dates by setting startDate  new Date    but I am able to select date from 04-21-2013   UPDATED  i can solve it as following for UTC zone   var d   new Date    options  startDate     new Date d setDate d getDate   - 1      or startDate    0d   But these methods don t work when UTC is a day ahead  For my client in California that means at 5 00 pm my client can no longer select his local current date as a valid date  In order to fix this I am temporarily using startDate   -1d   but of course before 5 that means yesterday is visible    Has anyone come up with a better method for now as I do not want to tell users to put in a UTC date   Thanks in advance

User · Answer

If your requirement is to disable the startDate and endDate dynamically based on one on another you can you this.

$('#date2').datepicker({
            todayHighlight: true,
            autoclose: true,
            format: "dd/mm/yyyy",
            clearBtn : true
        }).on('show', function(e){
            var date = $('#date3').datepicker('getDate');
            if(date){
             $('#date2').datepicker('setEndDate', date);
                }
    });

        $('#date3').datepicker({
            todayHighlight: true,
            autoclose: true,
            format: "dd/mm/yyyy",
            clearBtn : true
        }).on('show', function(e){
            var date = $('#date2').datepicker('getDate');
            if(date){
             $('#date3').datepicker('setStartDate', date);
                }
    });

If your requirement is just disabled past dates then you can use below snippet.

$('#date2').datepicker({
            todayHighlight: true,
            autoclose: true,
            format: "dd/mm/yyyy",
            clearBtn : true,
            startDate : new Date()
        })

If your requirement is just disabled future dates then you can use below snippet.

 $('#date2').datepicker({
                todayHighlight: true,
                autoclose: true,
                format: "dd/mm/yyyy",
                clearBtn : true,
                endDate : new Date()
            })

I hope it will help someone.

User · Answer

use   startDate   -0d    Like       datepicker   datepicker       startDate   -0d       changeMonth  true

User · Answer

Disable all past date   lt script type  text javascript  gt            function                    --FOR DATE----               var date   new Date                var today   new Date date getFullYear    date getMonth    date getDate                    Date1                 ctl00 ContentPlaceHolder1 txtTranDate   datepicker                 format   dd-mm-yyyy                 todayHighlight  TRUE                 startDate  today                endDate 0                autoclose  true                               lt  script gt    Disable all future date   var date   new Date     var today   new Date date getFullYear    date getMonth    date getDate           Date1        ctl00 ContentPlaceHolder1 txtTranDate   datepicker          format   dd-mm-yyyy          todayHighlight  TRUE          minDate  today         autoclose  true

User · Answer

It depends on what format you put on the datepicker So first we gave it the format       var today   new Date        var dd   today getDate        var mm   today getMonth   1    January is 0       var yyyy   today getFullYear        if dd lt 10           dd  0  dd             if mm lt 10           mm  0  mm             var today   yyyy  -  mm  -  dd    Here you put the format you want   Then Pass the datepicker  depends on the version you using  could be startDate or minDate which is my case          Datetimepicker       function                  datetimepicker1   datetimepicker               minDate  today    pass today s date             daysOfWeekDisabled   0               locale   es               inline  true              format   YYYY-MM-DD HH mm     format of my datetime  to save on mysqlphpadmin              sideBySide  true

User · Answer

var date   new Date    date setDate date getDate  -1        date   datepicker        startDate  date

User · Answer

Use minDate  var date   new Date    var today   new Date date getFullYear    date getMonth    date getDate          date   datepicker        minDate  today

User · Answer

HTML   lt input type  text  name  my date  value  4 26 2015  class  datepicker  gt    JS  jQuery function       var datepicker      input datepicker       if  datepicker length  gt  0        datepicker datepicker         format   mm dd yyyy         startDate  new Date                     That will highlight the default date as 4 26 2015  Apr 26  2015  in the calendar when opened and disable all the dates before current date

User · Answer

lt script type  text javascript  gt      datepicker   datepicker       format   dd mm yyyy       todayHighlight  TRUE       startDate   -0d       autoclose  true

User · Answer

Try it      function               datetimepicker   datetimepicker    minDate new Date

User · Answer

to disable past date just use          input-group date   datepicker          format   dd mm yyyy          startDate   today

User · Answer

The solution is much simpler       date   datepicker        startDate   now           Try Online Demo and fill input Start date  now

User · Answer

The following worked for me      input-group date   datepicker        format   dd mm yyyy        startDate  new Date

User · Answer

To disable past dates  amp  highlight today s date     function              input-daterange   datepicker           startDate   new Date            todayHighlight   true               To disable future dates  amp  highlight today s date     function              input-daterange   datepicker           endDate   new Date            todayHighlight   true               For more details check this out https   bootstrap-datepicker readthedocs io en latest options html highlight startdate quick-reference

User · Answer

Here it is     lt script gt              function                    var date   new Date                  date setDate date getDate   - 7                    datetimepicker1   datetimepicker                   maxDate   now                   showTodayButton  true                  showClear  true                  minDate  date                                  lt  script gt

User · Answer

In html   lt input class  required form-control  id  d start date  name  d start date  type  text  value    gt    In Js side   lt script type  text javascript  gt            document  ready function              var dateToday   new Date            dateToday setDate dateToday getDate                  d start date   datepicker               autoclose  true              startDate  dateToday

User · Answer

You can use the data attribute    lt div class  datepicker  data-date-start-date   1d  gt  lt  div gt

User · Answer

You can find your solution in this link below  https   codepen io ahmetcadirci25 pen NpMNzJ  Thats work for me   My code           var date   new Date            date setDate date getDate                  datetimepicker1   datetimepicker               isRTL  false              format   dd mm yyyy hh ii               autoclose  true              language   tr               startDate  date

User · Answer

Please refer to the fiddle http   jsfiddle net Ritwika gsvh83ry     With three fields having date greater than the     lt input type  text  type  text  class  form-control datepickstart    gt   lt input type  text  type  text  class  form-control datepickend    gt   lt input type  text  type  text  class  form-control datepickthird    gt   var date   new Date     date setDate date getDate  -1       datepickstart   datepicker    autoclose  true   todayHighlight  true   format   dd mm yyyy     startDate  date         datepickstart   datepicker   on  changeDate   function         var temp     this  datepicker  getDate        var d   new Date temp     d setDate d getDate     1         datepickend   datepicker    autoclose  true   format   dd mm yyyy    startDate  d    on  changeDate   function         var temp1     this  datepicker  getDate        var d1   new Date temp1      d1 setDate d1 getDate     1         datepickthird   datepicker    autoclose  true   format   dd mm yyyy    startDate  d1

User · Answer

You can simply add data attribute in html input tag   In rails html     lt    form text field  appointment date   data-provide    datepicker    data-date-start-date     0d    gt    HTML     lt input data-provide  datepicker  data-date-start-date   0d  type  text  name  appointment date  id  appointment date  gt

User · Answer

x000D   x000D  var nowDate   new Date    x000D  var today   new Date nowDate getFullYear    nowDate getMonth    nowDate getDate    0  0  0  0   x000D       date   datetimepicker   x000D    startDate  today x000D       x000D   x000D   x000D

[javascript] Bootstrap datepicker disabling past dates without current date

Examples related to javascript

Examples related to jquery

Examples related to twitter-bootstrap

Examples related to bootstrap-datepicker