Dropdown Inline Edit Specification

Storycards

The Dropdown Inline Edit Storycards are available on the Dropdown Inline Edit Storycards page.

The current storycards are:

• DD Story 1: Provide visual cues that Dropdown field is editable

• DD Story 2: Allow Editing of Dropdown field

• DD Story 3: Provide user with Undo & Redo capabilities

• DD Story 4: Placeholder for error handling

Functional Requirements

• Edit information with constrained choices in context. When editing/selecting, the choices are displayed in a dropdown.

• Display current selection while viewing new choices

• Undo edit

• Redo edit (undo the undo)

• If empty, display a message to let user know information can be entered

Wireframes & Storyboards

'Dropdown Inline Edit' Component (constrained choices)

Dropdown Inline Edit Storyboard

Visual Representation of Interesting Moments

Configurable Behaviors / Settings

• Whether or not user can select multiple items from the list

• Field width

• # of options to show (vertically) in dropdown without scrolling

• Hover text (e.g. "Click item to edit" is the default)

• Text inside field when opened (e.g. "Choose one" is the default)

• Whether the display of the field changes on mouseover (e.g. whether a yellow highlight and outline (with drop-down arrow) of field appears)

• What invitation text is displayed in an empty field (e.g. "Click to edit" is the default)

• Whether or not any invitation text is displayed in empty field