• I am using Elegant Themes Divi theme and using Contact form 7 with Contact Form 7 Datepicker.

    My Question is how do I block out ALL Mondays, Fridays and Weekends on datepicker?

    I’ve seen various code snippets but can’t quite figure it out. I am not a code expert, but a designer so any help would be much appreciated!
    Thank you
    Robbie

Viewing 3 replies - 1 through 3 (of 3 total)
  • DikkieDick

    (@dikkiedick)

    Hi, I’m using CSS Javascript and Toolbox plugin.

    And created something to be able to only choose Saturdays:

    jQuery(function($){
    $(“#proefles2kind”).datepicker({
    beforeShowDay: function(date){
    var day = date.getDay();
    return [day == 6];
    }});
    });

    But currently datepicker isn’t working at all in Contact Form 7. Well at least on my site.

    DikkieDick

    (@dikkiedick)

    I also did another try with WP Datepicker. It worked but after a few times didn’t work.
    This is for showing and being able to choose only wednessdays:

    At the end of the form use:

    <script language=”javascript” type=”text/javascript”>
    $( “#woensdag1,#woensdag2” ).datepicker({
    beforeShowDay: function(date){
    var day = date.getDay();
    return [day == 3];
    }});
    </script>

    and in the form on the line you need to use it:

    <p>Datum waarop u of uw kind de eerste proefles zou willen volgen (kies een woensdag)<br />
    [text* your-date1 id:woensdag1 class:dp]
    </p>

    <p>Datum waarop u of uw kind eventueel de 2e proefles zou willen volgen (kies een woensdag) <br />
    [text your-date2 id:woensdag2 class:dp]
    </p>

    DikkieDick

    (@dikkiedick)

    Finally:

    It wasn’t working as I wanted it (and not 100% yet, as I’m still able to choose dates in the past which I don’t want to).

    At the end of the form I have entered:
    —————

    <!doctype html>
    <html lang=”en”>
    <head>
    <meta charset=”utf-8″>
    <meta name=”viewport” content=”width=device-width, initial-scale=1″>
    <title>jQuery UI Datepicker – Default functionality</title>
    <link rel=”stylesheet” href=”//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css”>
    <link rel=”stylesheet” href=”/resources/demos/style.css”>
    <script src=”https://code.jquery.com/jquery-1.12.4.js”></script&gt;
    <script src=”https://code.jquery.com/ui/1.12.1/jquery-ui.js”></script&gt;
    <script>
    $( function() {
    $( “#woensdag,#woensdag2″ ).datepicker({
    beforeShowDay: function(date){
    var day = date.getDay();
    return [day == 3];
    }});
    </script>
    </head>
    <body>

    </body>
    </html>

    <script language=”javascript” type=”text/javascript”>
    $( “#woensdag,#woensdag2” ).datepicker({
    beforeShowDay: function(date){
    var day = date.getDay();
    return [day == 3];
    }});
    </script>

    —–
    In one way or another the part between <html> and </html> doesn’t show the calendar, but it let me choose the correct days in the form.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘How to Block out DAYS Mondays, Friday and Weekends’ is closed to new replies.