[SOLVED] How to set minimum date & time

[AliFarahat]

Hey Guys,

I need hep with this problem i am facing. I need to set a minimum Date & time on the Date/Time Picker. Right now the plug in only accepts date or time separately. What i am trying to do is set a minimum date of today +8 hours, so for example if the date / time is 27/09/2016 00:00 then the available dates and times must be greater than 27/09/2016 08:00

[jonaspalmqvist]

I was battling that before. I had two inputs of date picker. I wanted the end date picker to suggest a time +4 hrs on the start date picker.

I put initial content of end date picker to = “start date picker +(days) 0.167”.

I found it tricky to get it the way I wanted when you start adding options and behaviour.

[AliFarahat]

The problem I am facing is similar. The problem with the date picker is that it treats days and hours seperatly.

So if the minimum date is today and the minimum hour is 7 pm the subsequent days are also limited to 7 pm. What I want is to limit the today’s date to 7 pm only. Future dates and time not to be effected.

@NigelG did you face a similar situation?

[jonaspalmqvist]

Yeah, haven’t managed to solve that yet. I skipped it and “opened” the date picker instead. Not the optimal way in my mind, but better than half working solution.

I’m very interested to hear about @NigelG situation.

[NigelG]

[AliFarahat]

Thanks @nigel that is ingenious. Never thought of trying that!

[AFAOCDS]

@emmanuel, quick question please. Whats the possibility of exposing the minimum and maximum minutes for this element?

[cheskiefisch]

@AliFarahat

Im struggling with the same issue, did this solution work for you?

[pa.billet]

Hi,

For what I understand, you can just use decimal numbers to get the minutes (e.g. 0.5 for 00:30). If you extract that from a date format, juste make sure that you first extract minutes divided by 60 and then extract hours rather than the other way round (otherwise it will divide both hours and minutes per 60 and probably not give the decimal number you expect).

Hope that is clear

[guisantclair]

I was facing the same issue and managed to solve it by using a condition on the input field.

I set the minimum date for the “end date” input to be the same as the date selected in the “start date” input.

And to limit the hours, I created the following condition.

When the dates are the same in both fields, it limits the hours. If the end date is later, it allows selecting other hours.

I hope this helps you.

[mkenton1]

I got mine roughly working the same way.

However, there’s still the issue that the conditional is based on End Date’s value… which is until AFTER both the end date and time have been selected. In other words, it won’t work if the user clicks on an empty date/time picker for the End field.

This is a problem because the most typical flow is as follows:

1. User sees BLANK Date/Time inputs for Start & End Date
2. User enters Start Date & Time. Now it’s set.
3. User selects End Date… and moves to the Time component…
4. The user should see only the possible hours on the selected day… (min hour = start date/time’s value, if it’s the same day as Start).
5. But the user sees all hours, because the End date/time input’s value is still (empty) - so the conditional fails.

The only way I see around this is to set the workflow for the End Date to be auto-populated with the start date. However, I don’t like this, because it removes the flow… it takes away the indication that the user has 1 remaining step to fill out the end date/time by seeing the empty field.

Also, I can’t just user “initial content” = start date, because it gives the illusion that the End Date is set when it’s not actually in the database. (My users are pulling up records, not submitting a form when they see these fields…). Plus, I’d like to leave the possibility for them to choose if they intentionally want to keep the End Date/Time blank (for display, filtering, record keeping, etc.)

I just wish the date/time picker would expose the selected date value of the input even when the time has not been selected. Like “typed text” on searchboxes… Then this would all work. It would also help allow for all sorts of conditionals for min hour, based on the selected-but-not-submitted date component.

I think they didn’t want to, because there’s no “date” data in bubble. A date field is inherently a date&time, so it would correspond to midnight on that day.. and I guess they think people wouldn’t know how to work with this (or get all glitched out when dealing with time zones)

[mkenton1]

Ok… I actually solved my remaining issue. Add a click workflow to handle setting the blank input to the start date’s value. Then it has a value to work with. (And luckily bubble’s engine is quick enough that the calendar/dropdowns update fast enough)

If anyone intends to mirror this behavior but doesn’t have the data stored in the DB, I’m sure you can swap out my stored Start Date/Time value with the input element’s value (Start date/time picker) …for both the “only when” condition and the ‘make changes to’ value.

Or… if you aren’t intending to make changes to data yet, but you still want the functionality of grabbing the correct min dates upon clicking a blank date/time picker…
…you can group the End Date/Time input in a group of type=date, (Source=blank) and set the End Date/Time picker’s Initial Value to Parent group's date. Then, for the click workflow, you can replace my “make changes to” action with a ‘display data’ action that sends the Start Date to that End Date group.

I actually think I’ll switch to that method so I don’t get a loading indicator.

Hopefully this helps someone… I feel like anyone this far into frustration with the half-baked Bubble date/time picker has resorted to plugins long ago. lol.