Fetch date from database table to array for disable particular/selected date picker

Question

I have table from database here, where I want to fetch the date only (fld_booking_date in tbl_booking database here), in order to disable particular dates here that have been selected in database.

This is the coding that I set for the date :

<div class="form-group">
                    <label for="BookingDate">Date</label>
                    <input class="form-control datepicker" name="fld_booking_date" id="fld_booking_date" placeholder="mm/dd/yyyy" value="" required>
                  </div>

This is the script that I use to disable date selection, based on https://dzone.com/articles/disable-dates-in-datepicker & http://jsfiddle.net/sibeeshvenu/gj90f1bm/

var array = ["2023-01-04","2023-01-05","2023-01-09", "2023-01-10", "2023-01-11", "2023-01-12", "2023-01-13"]

$('input.datepicker').datepicker({
    beforeShowDay: function(date){
        var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
        return [ array.indexOf(string) == -1 ]
    }
});

I want to fetch the dates from database as the array, so that the dates can be disabled for selection (using dates that already in database, instead of those 7 dates). I am totally new in this, so I hope anyone can somewhat having way to get array to fetch the dates from database. Thank you so much, totally appreciated ~

Answer 1

Bismillah!

First of all you have to get all dates saved in your database (PHP Code) like:

$dates = array();
        
$date_query = "SELECT `YOUR_TABLE`.`YOUR_DATE_COLUMN` FROM `YOUR_TABLE`
                where YOUR_CONDITIONS";
$date_result = mysqli_query($con, $date_query) or die("Query Unsuccessful.");
  if (mysqli_num_rows($date_result ) > 0) {
    while ($row = mysqli_fetch_assoc($date_result )) {
       $dates [] = $row['YOUR_DATE_COLUMN'];
    }
  }

Then echo this variable in a javascript variable like:

var array = <?= json_encode($dates)?>;
$('input.datepicker').datepicker({
   beforeShowDay: function(date){
      var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
       return [ array.indexOf(string) == -1 ]
   }
});

JazakAllah! Have a nice Day.