How to Add a Calendar View in Jotform Tables

If you have an appointment form, an event registration form, an RSVP form, or a booking form, the Calendar view in Jotform Tables will come in handy. 

The Calendar view provides you with a visual calendar display that includes the appointments booked through your form. Each appointment will be listed on the appropriate date and time and will be labeled with the name of the form respondent. 

The information updates in real-time, so you’re always working with the latest data. The calendar view is easy to navigate and gives you a dynamic way to add new appointments. 

Let’s start! This guide covers the following:

• Steps to Create the Calendar View.
• The Different Logic of Match Event Fields Window.
• The Display Options of the Calendar.
• The View Settings.
• Viewing and Managing the Appointments.
• Drag & Drop and Expand Action on the Calendar.

Steps to Create the Calendar View

1. In Jotform Tables, click the Add Tab button.

2. Choose Calendar and click the Next button.

3. Here, you can choose to create a Blank Calendar or Connect to Form (connect to an existing form). Since this guide is for connecting existing registration forms to a calendar report, let’s step forward and choose Connect to Form. Click the Next button.

4. Search for and select your current form from the list, and then click the Next button.

5. On the next screen, you will find the options that would allow you to match your event fields. The dates and times can be from the form such as the appointment field or date picker. The static system dates such as the Submission Date and Last Update Date can also be chosen. You can also choose to add new date and time fields from the dropdown. Here’s the default screen:

The Logics of the Match Event Fields Window

1. Choosing an Appointment field from the Start Date dropdown will disable all other dropdown options. This is because the appointment field is designed to allow booking of a date and time slot with its duration automatically set through its settings.

Related Article: How to schedule an appointment with Jotform.

2. Choosing a Date Picker with Time option from the Start Date will disable the Start Time dropdown. It is the same for the End Date. Here’s an example:

3. Choosing a Date Picker field without the Time option from the Start Date will allow you to set the End Time. It is the same for the End Date. Here’s an example:

4. An Event Duration can also be chosen from the End Date if the Start Date is configured with the Date Picker field, with or without the Time option. Note that the Event Duration cannot be selected if you choose an Appointment field from the Start Date. Here’s an example:

There are predefined minutes, but you can choose All Day or Add Custom Minute(s).

5. As mentioned above, the Submission Date and Last Update Date can be chosen as the Start Date, but this will disable all other dropdowns.

6. Lastly, for instance, you do not have an appointment or date picker field in the form, you are required to add a new date & time field.

If you have chosen a Date Picker field without its Time option from the Start/End Date dropdown, you can also choose to add a new start/end time field.

Note that the Date & Time or Time fields added through this method are not created/added on the form. It’s only available for the Calendar view, and when adding a new entry into the calendar.

The Display Options of the Calendar

Once the Create button is clicked, the Calendar view is now created for you.

The Monthly view is the default display. There are two more Calendar view display options: Daily and Weekly. 

If you select the Daily option, only the appointments on that day will be visible. You can, however, navigate to other days by clicking the blue arrow icons.

If you select the Weekly option, the entries will be filtered by week, showing a full seven days of entries:

View Settings

Each appointment is displayed under the name of the submitter from the appointment form. The date is also based on the first appointment/date field from the form. If you need to change any of the information, open the settings and choose the appropriate fields.

Click the Tab Menu (Kebab or Three Vertical Dots Menu) beside the tab name, and then click the View settings option. Alternatively, you can open the settings by clicking the View Settings button from the list of buttons visible at the top-right side of the calendar.

Reconfigure the Event Date Settings or select the Event Title Field, change the First Day of the Week to either Sunday or Saturday, Select a Country for Holidays. Click the Done button to save your changes. 

Viewing and Managing the Appointments

Clicking the name of the submitter will open a quick view of the appointment. The display will show the title and date, formatted as specified in the settings. Click the small blue arrow icon to open the full entry.

The Calendar tab allows you to quickly navigate to each month of the year and view appointments for that month by scrolling.

In the Events tab, you can see a list of appointments for the active month in the Calendar view. You can also filter out entries according to whether or not they include an appointment date: All Events, Events with Date, and Events without Date.

All Events displays every event, regardless of whether the submission includes a date.

Events with Date display entries that have appointment dates.

Events without Date will show submissions that don’t include a date answer selection in the appointment or date picker field. This may happen if the field is optional.

If the submitter contacts you to set their appointment date, you can drag and drop their entry to the specific date block in the calendar instead of editing their submission.

Clicking the name of the submitter under the Events tab will also open the full view of the submission.

Did we mention you can dynamically add appointments in the calendar without viewing and submitting your form? That’s right! Just select and double-click the date where you want to add the appointment.

If you want to add the event on the current day, click the + New Event button.

Add the details of the appointment by double-clicking the fields. Tap the Enter key on your keyboard to save. Close the window by clicking the X button. This will also save the entry.

Drag & Drop and Expand Action on the Calendar

Yes, it’s possible to move the entries of the calendar by drag and drop. The appointment dates can also be expanded. However, there are conditions to that. 

If you have chosen the Appointment field as the Start Date or have chosen the Event Duration as the End Date, the entries can be moved but cannot be expanded.

If you have chosen the combination of Date Picker with or without the time field in the Start and End DateTime or Dates and Times, the entries can be moved and can be expanded. 

Lastly, you can’t move or expand events if you have selected the Submission Date or the Last Update Date as the Start Date. 

That sums up everything for the Calendar view. If you have any questions or suggestions, please contact us through one of the support channels below.