Calendar Woes

By: Dan Zahlis | Asked: 08/08/2022
ForumsCategory: General questionsCalendar Woes
Dan ZahlisDan Zahlis asked 2 years ago
I am just an old guy that overcommitted to developing a proof of concept for a NFP. (Un)fortunately, and thanks to Formidable Forms, they love the system. Now they're asking me to add functionality which makes my brain hurt and I can use some help. The latest challenge has to do with selecting a calendar date. Use case: We have 40 school sites submitting referral forms to the NFP. One of the form fields is a date field for a scheduled service but the field is service (not school) specific and it's displayed using conditional logic. The NFP wants to display a calendar view of available dates based on a Service Offered AND a specified school site. I have created a separate date field for each service offered (5) and use conditional logic (Service field = "Service") to display the appropriate date field. This allows me to display the assigned dates in a Calendar view filtered by school site and it works great. However, ... The Problem: The NFP wants the date picker to display blackout (or available) dates in the date picker. That's impossible with my current approach because the date pickers are not specific to a combination of a school AND a service. The only way I can think of the achieve this is to create a separate date field for each school by service type (that's 200 calendars operating on conditional logic to display the date choices specific to a combination of school and service). One way to make this possible would be to add functionality to the date picker whereby blackout dates could be assigned using conditional logic (eg when field 1 = X and field 2 = Y, blackout these dates). Another possibility might be to use a more robust plugin like Simply Schedule Appointments. Has anyone encountered this date picker limitation or have experience enough with Simply Schedule Appointments to offer any ideas? Any help will be greatly appreciated!
Dan ZahlisDan Zahlis replied 2 years ago

After watching the Simply Schedule Appointments (SSA) FF integration video, I suspect my best case scenario might be to create 40 SSA schedules (1 per school) with each schedule offering five courses and the calendar for each of the five courses displaying the appropriate blackout (or available) dates. I would display the appropriate schedule using conditional logic where school site = school site. Just thinking aloud.

Bobby Clapp replied 2 years ago

Is all of the data on one calendar now or are you posting a calendar for each school and filtering it some way? Couldn't you use view parameters dynamically to populate the calendars for the filter and then the school?

[display-frm-data id=x filter=limited school="webster"]

Dan ZahlisDan Zahlis replied 2 years ago

I am using one calendar for each service (there are 5) and using conditional logic to display the calendar corresponding with the selected service. I am filtering the calendar view using "School Site is equal to [user_meta key=user_school_site]". There are five separate Calendar views filtered the same way and it all works perfectly.

My problem is I cannot offer the user a calendar control (date picker) with blackout dates because each school will have different blackout dates and those blackout dates will vary between the five different services.

I don't think there is any way to avoid at least one calendar for each school site and I will need to include five types of services for each calendar. I think it can be done using Simply Schedule Appointments and its integration with FF, I'm still researching the Simply Schedule Appointments plugin.

It's a real head scratcher.

2 Answers
Walter JonesWalter Jones answered 2 years ago
So right now your 5 calendars are for the services and then filtered by school through the users meta? But you now need to be able to black out dates from a date picker per school and per service? Or does each school only have 1 service? How many schools are there?
Dan ZahlisDan Zahlis replied 2 years ago

"But you now need to be able to black out dates from a date picker per school and per service?"

That's correct, Walter. 5 calendars, 1 for each service, displayed using conditional logic. The calendar view is being filtered by school (40 schools and counting) using a custom user meta field. There's one page per service where the schools can view the calendars with detail links to see details for each service assignment. The schools can only see their own data. It works great but the client wants a date picker to have dates blacked out based on school AND service.

I have suggested they generate a physical services calendar (or 5, 1 for each service) for each school and have the user view a physical document to determine availability of services at their school when selecting the date in the referral form. It's not ideal but neither is 200 calendars (5 services x 40 schools). A single calendar for all schools and all services that can be filtered to display the relevant options would be better... assuming there's not a more automated solution.

Thanks for understanding/restating the problem. 90% of problem solving is problem seeing!

Walter JonesWalter Jones answered 2 years ago
Hey Dan,   Here is some code that may help you related to blackouts.  I am not exactly sure how it's implemented in your work flow, but basically what this code does is, it takes two datepicker fields (start date) and (end date) and blackout the time between those dates for a third date picker field.  This is really only useful on the front end.  Perhaps it will help you... datepicker #1: field_bitf datepicker #2: field_iveal datepicker #3: field_kxnt7  
var startDate, endDate, dateRange = [];
dateFormat : 'yy-mm-dd',
onSelect: function (date) {
startDate = $(this).datepicker("getDate");
dateFormat : 'yy-mm-dd',
onSelect: function (date) {
endDate = $(this).datepicker("getDate");
for (var d = new Date(startDate);
d <= new Date(endDate);
d.setDate(d.getDate() + 1)) {
dateRange.push($.datepicker.formatDate('yy-mm-dd', d));
$("#field_bitf, #field_ivea1").datepicker("setDate", new Date());
beforeShowDay: function (date) {
var dateString = jQuery.datepicker.formatDate('yy-mm-dd', date);
return [dateRange.indexOf(dateString) == -1];
Dan ZahlisDan Zahlis replied 2 years ago

Thanks, Walter. I'll play with this. One of my original goals for this site was to keep it simple and rely exclusively on existing plugins. I wanted to make the site turnkey for the NFP so they could maintain the system internally with some basic training. Things are starting to get a bit more complicated!

Making the Best WordPress Plugin even better - Together

Take on bigger projects with confidence knowing you have access to an entire community of Formidable Experts and Professionals who have your back when the going gets tough. You got this!
Join the community