Metadata
- Source
- IDI-159
- Type
- Task
- Priority
- Major
- Status
- Closed
- Resolution
- Fixed
- Assignee
- Jonathan Hung
- Reporter
- Jonathan Hung
- Created
2017-11-25T08:22:44.680-0500 - Updated
2018-01-22T13:25:06.284-0500 - Versions
- N/A
- Fixed Versions
- N/A
- Component
-
- BIG IDeA
Description
This task includes:
- 1/2d - Implement the text field and validate the input.
- 1/2d - Implement Javascript to handle the enabling / disabling of the text field (see possible JS implementations below)
Possible JS Implementations:
- User can select “Other” from a radio group which they can then type in their response. Like this: https://jsfiddle.net/j08691/pgyA2/, but may not be valid. 1/2d
- User can select “Other” which enables a new text field which they can fill in. Requires Javascript. See JS below
- Both form fields are available (both the selector and the text field). It’s up to the user to use the right one. Use good labelling.
Code Sample
HTML:
<!-- The second value will be selected initially -->
<select name="select"> <!--Supplement an id here instead of using 'name'-->
<option value="value1">Value 1</option>
<option value="value2" selected>Value 2</option>
<option value="value3">Value 3</option>
<option value="other">Other</option>
</select>
<input type="text" class="other" disabled >
JS:
var select = $("select");var other = $(".other");
select.on("change", function (e) {
if (select.val() === "other") {
other.prop("disabled", false);
} else {
other.prop("disabled", true);
}
});
Comments
-
Jonathan Hung commented
2018-01-22T13:24:12.178-0500 A non-Javascript solution was used. Instead there is an optional text box a visitor can fill out. This made implementation easier and simplified accessibility.