How exclude a day (jQuery datepicker + Contact Form 7)


    [date your-date id:datepicker]
    <link rel="stylesheet" href="">
    <script src=""></script>
      dateFormat: "yy-mm-dd",
      beforeShowDay: function (date) {
        return date.getDay() == 2 ? [false, " disabled"] : [true, " enabled"];
    .disabled {
      color: #000;
    .enabled {
      color: #ff0000 !important;
    input[type="date"]::-webkit-calendar-picker-indicator {
      -webkit-appearance: none;
    [submit "Submit"]

    Post navigation

    You might be interested in...

    2 responses to How exclude a day (jQuery datepicker + Contact Form 7)

    1. Hey Erik,

      Great post with and a great solution.
      I do have one problem when implementing this solution, on mobile screen sizes the styling is completely off, how did you fixed that?

    2. if you see it completely off the screen, it is possible that jquery cannot position the calendar below the input (it is an element at the end of the html that is positioned below the input with position absolute).
      I found this article, that explains well how to style the calendar but if you have any problems send me the link to your form and I’ll try to figure out what the problem is (if I can of course) bye!


    Your email address will not be published. Required fields are marked *