1

MockupImageI need a way to select a date range and edit the date range. Also when a date range is selected it will show other dependent information.

My plan was to use radio buttons and whichever date range radio button is selected will be editable and that range's dependent information will show.

My question is are editable radio buttons common? Is there a better option?

  • Perhaps you could do a little mockup or wireframe of what you have in mind? Typically a checkbox, not a radio button, would be preferred if both the start and end date can be toggled on and off. – cloudworks May 6 at 15:01
  • Image has been added. Checkboxes wouldn't work in this case because only one date range can be selected at a time. – Megan May 6 at 15:13
  • Thanks for the image, I agree with you about checkboxes not being the right approach here, I'd imagined something different. – cloudworks May 6 at 15:15
  • Sorry, the question seems a little unclear. If only one date range can be selected, why display 3? Why are the other two present when the user can just select date range from a single date picker? You could then load the dependent fields based on the dates chosen from the date picker. – Ashwin Nepal May 7 at 12:10
  • The user needs the ability to edit and change all three of the dates at one time. – Megan May 7 at 14:52
0

The most common date range picking interface is calendar combine with type input. [source] Base on your context you can choose alternative ranging inputs like these:

If it's one of them better highly depends on your context. Your input choice is generally used and so more familiar for users.

0

From what I understand, only the selected date range is editable. In this case, I would remove the date picker / calendar icon from the other rows.

In the current design, it's not immediately visible which date range the dependent fields are associated with: you could highlight the background of the selected date range and the dependent fields in the same color, to indicate a visual continuity between them. Another solution would be to insert the dependent fields immediately below the selected date range, which would remove any ambiguity.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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