CODEWITHSUNDEEP
phpjqueryjquery-ui
bateman_ap
bateman_ap

Reputation: 1921

Using beforeShowDay in JQuery UI Datepicker to close out days of the week

what I am trying to do is grey out some days of the week for a venue for when it is closed. Each venue might be closed on different days.

I can use the following code as a test to close out all Sundays:

$('#bookingDatepicker').datepicker({
                minDate: 0, 
                maxDate: '+3M',
                dateFormat: 'DD, d MM, yy',
                altField: '#actualDate',
                altFormat: 'yy-mm-dd',
                beforeShowDay:  closedDays
            });

function closedDays(date) {
  if (date.getDay() == 0){ 
  return [false,"","Venue Closed"]; 
  } else { return [true, ""];
}
}

However I might have to close out more than one day and they might not run next to each other. In my code from the database I can create a string, examples below, which show what days are open...

1,2,3,4,5,6,0    //I would want to show no days closed
2,3,4,5,6        //I would want to show Sunday (0) and Monday (1) closed

I am not sure what to do with this though to get the code above to work. I am using PHP to create the string so can manipulate it using that if need be.

EDIT

As is usual when you post a question you get a minor breakthrough! I have developed the code below, it works if I use the dummy data in it, however I need find a way of wrapping my string values in "". That is now causing me trouble, if I just use var cloDays = [2,3,4,5] it ceases to work

var cloDays = ["2","3","4","5"]; 
 function closedDays(date){
 var sDate = date.getDay().toString();
 if ($.inArray(sDate, cloDays) == -1) return [false,"","Venue Closed"];
 else return [true, ""];
}

Upvotes: 1

Views: 13983

Answers (2)

Tokes
Tokes

Reputation: 201

this post didn't solve my problem but pointed me in the right direction.

This is what worked the way I wanted:

var unavailableDates = ["9-5-2011","10-5-2011"];

function unavailable(date) {
    dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
    if ($.inArray(dmy, unavailableDates) == -1) {
        return [true, ""];
    } else {
        return [false,"","Unavailable"];
    }
}

$('#iDate').datepicker({ minDate: +1, beforeShowDay: unavailable });

This blocks all dates in the past including today and then blocks the dates specified in the unavailableDates array.

Upvotes: 3

bateman_ap
bateman_ap

Reputation: 1921

Managed to fix it by running my string through the code below, basically explodes it into a PHP array and then encodes it using JSON_Encode. Seems to work perfectly:

$cloDays = json_encode(explode(",", $cloDays));

Upvotes: 0

Related Questions