We help IT Professionals succeed at work.

jQuery UI datepicker: startDate / endDate - Stopping selectable dates based on day of the week

688 Views
Last Modified: 2017-03-10
Using some code now to prevent selecting an "End Date" before a "Start Sate"...

            var dateFormat = "mm/dd/yy";
            var from = $("#StartDate").datepicker({
                changeMonth: true,
                numberOfMonths: 1
            }).on("change", function () {
                to.datepicker("option", "minDate", getDate(this));
            });

            var to = $("#EndDate").datepicker({
                changeMonth: true,
                numberOfMonths: 1
            }).on("change", function () {
                from.datepicker("option", "maxDate", getDate(this));
            });

            function getDate(element) {
                var date;
                try {
                    date = $.datepicker.parseDate(dateFormat, element.value);
                } catch (error) {
                    date = null;
                }

                return date;
            }

Open in new window


I need to change this to also only allow a date to be selected up to the next sunday. i.e. looking at a current 2017 calendar, if I were to select today (Friday, March 10) as a "Start Date" then i would only be able to select dates through March 12, which is the next Sunday. (So only March 10, 11, and 12, would be available for "End Date"

Another example would be April 3 (Monday) is the start date.
April 4 (Tuesday)
April 5 (Wednesday)
April 6 (Thursday)
April 7 (Friday)
April 8 (Saturday)
April 9 (Sunday)
would be the only selectable options for "End Date"

How would I do this?
Comment
Watch Question

CERTIFIED EXPERT
Most Valuable Expert 2017
Distinguished Expert 2019

Commented:
Why not set To min date to today's date as well.
Owner
CERTIFIED EXPERT
Top Expert 2014
Commented:
This problem has been solved!
(Unlock this solution with a 7-day Free Trial)
UNLOCK SOLUTION

Author

Commented:
That's actually perfect Brian, thank you!
Brian TaoOwner
CERTIFIED EXPERT
Top Expert 2014

Commented:
You're welcome. One modification, line #10, #11 in my previous code should be:
      var nextSunday = new Date(fromDt.getTime());
      nextSunday.setDate(nextSunday.getDate() + 7 - fromDt.getDay());

Open in new window