Calendar form option


It would be great if we could have a calendar form field, similar to when on a booking website you can click a field and a calendar pops up to allow you to choose a date.



Hey Oliver,
While this is something we really want to provide in the core Unbounce form builder, it is possible to accomplish it today with a little extra scripting (in this case, using the jQuery UI library). I just wrote a step-by-step article in our Knowledge Base about how to do it called “How to add a calendar “Date Picker” to your form.” Please give it a shot and let me know if you run into any trouble.

Hope that helps!


Another feature would be to allow a person that has registered for an event to add the event to their calendar and have this option appear on the confirmation page.


Somebody removed your article, Carter! Can you re-post? It will be greatly appreciated!


Oops sorry about that, here’s the updated article:


Is there a way to add a time picker in addition to date. I need to be able to set appointments


Hi Manuel, 

Can you provide a bit more background on your time picker questions:

  • Do you just need to show time slots or do you need to check your calendar and show only available time slots dynamically?

  • If you are just showing the same time slots everyday would they be the same for each date?

  • Will you be excluding weekends?



I have used this implementation on several forms and it works perfectly. 


Cynthia, That is possible! But it is not native to unbounce :frowning:  I asked the same question in this thread a while back.…

The answer is to use a platform called It is pretty simple, and works great.



Can’s seem to get this to work. Does this still work? Should the scripts be on the form page (it’s on a separate lightbox here) or on the main page?

See attached a screenshots (sorry can only post 1):



Hey @nivvle,

Does your dev console give out any errors?

Also, it would be good to post a link to the page so the community here can actually take a look at the code.


EDIT: Try also moving the script placement to “Before Body End Tag”. In general, very few things need or should be placed in the “Head”.


Is there a way to block Sundays and have the next available date no closer than 2 days away. I have researched online and they suggest a maxDate: “2”, and beforeShowDay: function(date) { var day = date.getDay(); return [(day != 0 )]; }, but I don’t know how to use these within the date picker code provided.