CODEWITHSUNDEEP
javascriptjquerydatepicker
Ženia Bogdasic
Ženia Bogdasic

Reputation: 117

Datepicker disabling dates

I'm trying to disable dates which are stored on a database.

<script type="text/javascript">

   var dates = JSON.stringify( '<?php echo json_encode($darray); ?>');
   function BookedDates(date) {
        for (var i = 0; i < dates.length; i++) {
            if (new Date(dates[i]).toString() == date.toString()) {
                return [false];
            }
        }
        return [true];
    }
  //  alert(dates)
    console.log(dates);
</script>

<p>Date: <input type="date" class="datepicker2" name="date"></p>

The script above prints dates on a console just like that:

"[{\"date\":\"2016-04-02\"},{\"date\":\"2016-04-08\"},{\"date\":\"2016-04-15\"},{\"date\":\"2016-04-29\"},{\"date\":\"2016-05-07\"}]"

However, the problem comes when I try to disable those dates in Date picker:

$(function(){
    $('.datepicker2').pickadate({
        dateFormat: 'yy/mm/dd',
        beforeShowDay:[
            BookedDates
        ]
    });
});

I get no error or anything on a console, those dates from array are just not being disabled, would very much appreciate any help.

Upvotes: 1

Views: 922

Answers (1)

jumps4fun
jumps4fun

Reputation: 4132

It seems like you are using pickadate.js, while trying to implement functionality that belongs to the JQuery UI datepicker. Those are two different libraries. You need to go to the pickadate.js api, and find a solution there:

http://amsul.ca/pickadate.js/api/

Here is a short summary of the relevant part:

You can disable sets of dates and then enable the entire set or specific dates within those sets by the following methods:

Specific dates:

picker.set('disable', [

  // Using a collection of arrays formatted as [YEAR,MONTH,DATE]
  [2016,9,3], [2016,9,9], [2016,9,20],

  // Using JavaScript Date objects
  new Date(2015,9,13), new Date(2015,9,24)
])
picker.set('enable', [
  [2016,9,9],
  [2016,9,13],
  new Date(2015,9,20)
])

Upvotes: 1

Related Questions