How do I disable all sundays within jquery datepicker

Question

0.00/5 (No votes)

See more:

I'm following behind another coder and have never used jQuery's Datepicker before, and I am somewhat lost... and not very good at this in the first place. I've been asked to disable all Sundays in Datepicker so people can't select those days for appointments, but all the original coder left me was:

JavaScript

jQuery('#date-needed').datepicker({
    minDate: 0,
    maxDate: '+14d'          
});

I know this means that people can't make appointments outside of two weeks from the day they make them, but that's about it. There must be a simple(ish) way to solve this, but nothing I've tried has blacked out the Sundays, and most methods seem to break the widget altogether. Help!

What I have tried:

I've tried simple things, like adding

JavaScript

daysOfWeekDisabled: [0]

and...

JavaScript

WeekdaysDisabled: [0]

and I got a little fancier and tried to make a function...

JavaScript

JQuery('#date-needed').datepicker({
    minDate: 0,
    maxDate: '+14d'
});

JQuery('#date-needed').ready(function() {
    $(function() {
        $(".datepicker").datepicker({
            dateFormat: 'dd-mm-yy',
            beforeShowDay: my_check
        });
    });

    function my_check(in_date) {
        if (in_date.getDay() == 0) {
            return [false, "notav", 'Not Available'];
        } else {
            return [true, "av", "available"];
        }
    }
});

...and about a dozen other iterations... I obviously need to brush up on my coding in a big way (I know there are... so many problems there), but if anyone has any suggestions as to how I can fix this, I'd greatly appreciate it!

Posted 23-May-23 9:33am

Josh Mitchell

Updated 23-May-23 22:37pm

Richard Deeming

v2

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Richard Deeming · Accepted Answer · 2023-05-23T22:37:00

As already answered here[^], you need to use the beforeShowDay property:
beforeShowDay | Datepicker Widget | jQuery UI API Documentation[^]

You were close with your final code block - you just need to add the callback to the initial datepicker call, and get rid of the entire .ready block:

JavaScript

jQuery('#date-needed').datepicker({
    minDate: 0,
    maxDate: '+14d',
    beforeShowDay: function(date) {
        return date.getDay() === 0 ? [false, "notav", "Not Available"] : [true, "av", "Available"];
    }
});