How to show display of Hours : Minutes (eg 9:00 AM) for customers to select their store hours

Friends, I want users to Select the Time of they need service. For example From 9:00 AM to 5:00 PM, 9:30 AM to 6:30 PM, 8:00 AM to 4:00 PM… like this

They should be able to select the Hours (12 hour system is fine), they should be able to select the Minutes (increments of 5 min are fine if not exactly by minute) and they should be able to select the AM/PM option.
I tried air drop time/date plugin but does not work. Please advise how to do this?

Hey @applepatient :wave:

I tend to just end up using an Option Set and put in the values that I want. It ends up just being a nicer user experience when you can customize the input/dropdown for them to use.

I am sure others have their preferred method as well. This is just my personal preference. :blush:

Does that help?

honestly that is what i ended up doing. Here is what i did . i made option set of 1,2,3,4… until 12 for Hours. then i made another option set of :00 AM and :00 PM… So total two dropdowns to pick hours/minutes/AM or PM. is it good enough?

you could have saved yourself some work by using the numbers list plugin
create numbers list starting from 0, increment by X
set drop down to numbers list
then store the selection in database

you could also just use text input and then a regex (or I think there’s a plugin) to convert it to hour and minutes

ie user types 10:30 am
regex captures digits until : and after : and looks for AM/PM
could force validate the field to simplify the regex required or use chatgpt to interpret instead of regex

1 Like