Skip to content
Yin Zhang edited this page Aug 15, 2014 · 30 revisions

Modal dialogs in Cockpit should have consistent behavior. These are the Human Interface Guidelines for dialogs.

Look

Dialogs should be implemented as Patternfly modals.

This section is incomplete...

Behavior

  • Disable affirmative button when dialog has invalid contents or the content is empty.
  • Make primary input field got focused when the dialog shows up. Primary input field is usually the first input field which needs required input contents.
  • Support Enter key for input fields and primary buttons in the dialog. (To be determined)
    1. Primary button is the button used for finishing the function of the dialog, is usually an affirmative button.
    2. If there is only one input field, pressing Enter key behaves the same as clicking primary button.
    3. If there are more than one input field, pressing Enter key moves the focus from the previous input field to the next one sequentially. When the last input field gets Enter key stroke, it behaves the same as clicking primary button.
  • Support Tab key for all interactive elements, the sequence of tab indices should follow the positions of the elements, from top to bottom, from left to right.
  • Show error messages below the input fields. (To be determined)
  • Show error messages when there are invalid characters, indicate the last character in the error message. (To be determined)
  • Replace the invalid characters with empty characters without showing error messages. (To be determined)
  • ...

This section is incomplete...

Clone this wiki locally