1

I have a form where users can input their availability for each weekday in terms of time. However, the following dates should no longer be editable:

  1. Past dates (for obvious reasons)
  2. Today's date
  3. Tomorrow and the day after tomorrow

enter image description here

The non-editable dates can either be plain text or read-only fields, but they should have some sort of explanation as to why they're no longer editable. What's the best way to do that?

So far, there are a few options I thought of:

  1. A description under the page title (this makes for a clean design, but users may easily miss this)

  2. Some sort of tooltip that appears after hovering over each disabled field (clearer to the user as it's more contextual, but adds a lot of clutter since the tooltip can appear on each disabled field - and there could potentially be multiple!)

  3. Maybe a link below the disabled fields saying, "Why can't I edit my availability for the dates above?" The link opens up a tooltip with the explanation (The link could use some wordsmithing)

2 Answers 2

4

You got some good ideas there - just do all (or most) of them, I would say. Redundancy is always good, some users will see this option and others will understand the other one better. Just prevent clutter, keep it subtle.

As an additional idea: Your list of dates is always ordered, right? So how about having an element between the last of the dates that is uneditable and the first one that is editable?

Like for example a horizontal bar and a text saying "(i) for reason X, you can only edit times that are at least 48 hours in the future" (or whatever fits).

3
  • 3
    Love this. The separator is a great visual for explaining this deadline.
    – peq
    Sep 26, 2022 at 6:45
  • Thanks for your feedback! I think the problem with some sort of delineator is this is a rolling calendar. So the number of editable and non-editable dates could vary, so the second delineator could move around. For example, for this week, Wednesday will have 5 non-editable days while Friday will have 7 non-editable days.
    – J Bo
    Sep 26, 2022 at 21:44
  • I see. Please clarify, do you see this as a UX problem or do you mean it's difficult to build technically?
    – Kolja Sam
    Sep 26, 2022 at 22:13
0

I'd suggest you to check why you need the non-editable fields on the same form as the editable ones. Do you really need to display them simultaneously?

And what are you going to do if some users just want to view their future availability, and to avoid accidental changes they want to see all the entries in the read-only mode?

If not, then I'd suggest following approaches.

  1. Use one form to display editable fields only. Make it callable vie menu or button "Edit". Use another form to display the non-editable fields. Make it callable via menu or button "View".

  2. More precise split: Split it into 3 cases, "Edit" (display only what is editable), "View near future" (today and 2 next days), "View history" (past days).

The advantage of these approaches is, that you don't need to provide explanation to every single entry. If you need an explanation text, you can put it only once and it will be applicable to all entries on the form.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.