Search code examples
htmlvalidationwebformsusability

UI to indicate a "Partially-required" field in web form?

I have a set of radio buttons where a selection is required. In addition, there is an optional text box that shows up next to one of the selections.

What would be the best way to make it clear what is required and what is optional?

<strong>User Availability:</strong><br>
<input value="Available" type="radio"> Available<br />
<input value="Unvailable" type="radio"> Unvailable
until <input type="text"> <small>MM/DD/YYYY</small>

Thanks in advance for any ideas. I'm also open to a completely different approach.

Clarification: The "optional" part is the date. You MUST select either Available or Unavailable. But the date is optional.

This is a UI question, not a technical one.

Solution

  • Assuming "mm/dd/yyy" is the textbox, I'd put the this text in the textbox, with it being cleared when the user clicks or otherwise sets focus on the textbox:

    (date) (optional)