This is the feature I need:
Think of yourself as a part time employee. You are allowed to enter up to 2 time intervals to specify your availability for the day.
So there are 4 textboxes/timepicker.
- Availability 1 start time
- Availability 1 end time
- Availability 2 start time
- Availability 2 end time
I am thinking to guide the user to make a valid request,
- All inputs except availability 1 start time is enabled
- As availability 1 start time becomes valid, I enable availability 1 end time
- When availability 1 pair is valid, I enable availability 2 start
- When availability 2 start is valid, I enable availability 2 end
- Same in reverse, if availability 1 end becomes invalid, availability 2 is disabled
But looking at this, it looks complex to develop and possibly confusing to the user. How would you go about this? Perhaps just have all inputs enabled, then show error messages?
This is made more complex as its a "realtime" app, so as inputs are changed and valid, they are saved. What might a user expect if availability 1 is cleared/invalid while availability 2 is still there? An error message is shown, but no save is made.