Calander options

Hi, i am trying to add an overview calander which shows when certain days are booked (for a house). Any advice of what is the best thing to use? I wondered whether using a plug in from Goggle calanders would work best?

I would suggest you to use the Date Reservation widget. You can find it here:

https://www.jotform.com/widgets/date-reservation

It will allow you to avoid double bookings. The widget will let the users to select dates on a calendar. The dates will then be marked as booked and will be unable to be selected by other people filling out your form.

Please give it a try and let us know if you need any further assistance.

Hi, this is helpful, thanks. Although, how can i block out old dates that are already booked? i.e someone can next week is taken. 

Hello,

Thank you for your message.

In that case, you can use the widget https://www.jotform.com/widgets/appointment-slots this is a demo form https://form.jotform.com/201144832839052.

You can set up the start date, the end date is optional.

If you need any further assistance, please let us know. We will be happy to help.

Hi,

I am struggling to get this to work. Is it possible to block out periods? And, is it possible to select days rather than hour slots etc? 

Hi,

You can block a period, for example here https://form.jotform.com/201144832839052, as you can see here I just have available from June 12th to 17th.

Regarding the hour slots, you can set up 24 hours but, the user needs to select at least the beginning of the day.

If you need any further assistance, please let us know. We will be happy to help.

Thanks for this, I have it working. But, I have applied it to my squarespace page now, link below with password ITFC, but as you will see it is cutting off the bottom of the form on the page? Any ideas? It would also be good to be able to move the form up a bit, there is a bit too much padding from the top. 

https://www.leperchoirfrance.com/new-page

I have checked the embedded form and it seems you're using the Iframe embed.

I would suggest increasing the height of your iFrame, you may also enable scrolling.

Please give it a try and let us know how it goes.

Great work, this has worked. Thanks. On the form i now have, see link below p/w ITFC. Is there a way to remove the 09.00 selection? I am trying use the top calendar to show booked periods, (no selection required or needed) and then the underneath is the booking element. Or another way, can there be custom code to edit appointment box to say something instead of 09.00?

https://www.leperchoirfrance.com/new-page

I forgot to add too, if i need to update the info in Jotform, i.e block out a period, do i need to do that in the Jotform area and then copy the code across each time or will it sync? 

Hi @ballard991

You can use this CSS code to hide the time slots:

.appointmentSlotsContainer {

    display: none !important;

}

Please check this guide that explains how to inject custom CSS to your form:

https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

As for your second question, the form will sync each time you change it. You will not need to copy the code again.

Please let us know if you need any further assistance.