I want to Disable certain Future Dates of html date picker (input type="date") using PHP and mysql

Question

I want to Disable certain future dates of HTML date picker (input type="date") using PHP and MySQL.

Can someone help me to do this. I was trying to do this and went through Google and didn't find a way to disabled certain dates using PHP and MySQL.

Does this answer your question? [Restrict future dates in HTML5 date input](https://stackoverflow.com/questions/23671407/restrict-future-dates-in-html5-date-input) — Chilarai, Jul 13 '20 at 05:17
So you want to allow some future dates to be submitted, but not put them in the database? What *do* you want to happen? — ysth, Jul 13 '20 at 05:36
This is for event website. so simply i want to disabled dates that already have events — Danura senan, Jul 13 '20 at 05:49

score 1 · Accepted Answer · answered Jul 13 '20 at 05:41

Here is a demo. This uses Bootstrap datepicker and jquery. Also, I have mentioned in the comment inside the code on where to use php

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.css">
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.css">
    <script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.js"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
</head>
<body>
   
<div class="container">
    <input type="text" name="date" class="form-control datepicker" autocomplete="off">
</div>
   
</body>
  
<script type="text/javascript">
    // This can come from php
    // var disableDates = [<?php //echo $your_variables_from_php_mysql_printed_in_the_format_below; ?>]
    var disableDates = ["7-7-2020", "14-7-2020", "15-7-2020","27-7-2020"];
      
    $('.datepicker').datepicker({
        format: 'mm/dd/yyyy',
        beforeShowDay: function(date){
            dmy = date.getDate() + "-" + (date.getMonth() + 1) + "-" + date.getFullYear();
            if(disableDates.indexOf(dmy) != -1){
                return false;
            }
            else{
                return true;
            }
        }
    });
</script>
</html>

Thank you brother.just one last things if you can help. is there any way that i can show a message if user clicked disabled date as it has already booked — Danura senan, Jul 13 '20 at 05:59
Sorry disabled fields cannot be clicked here. I believe. Please read more on Bootstrap datepicker https://bootstrap-datepicker.readthedocs.io/en/latest/events.html — Chilarai, Jul 13 '20 at 06:52
Thank you. do you know if it possible to change color of disabled dates — Danura senan, Jul 13 '20 at 10:01
@Danurasenan just go to css and change color of text in `.disabled` class or create your own `.disabled` class in css — Chilarai, Jul 13 '20 at 10:25
Hello, Do you know how to do this with sandbox-container. i was try to add it.but its not showing any calendar. — Danura senan, Jul 14 '20 at 00:46

I want to Disable certain Future Dates of html date picker (input type="date") using PHP and mysql

1 Answers1