Buttons, Save & Cancel

Problem Summary: The customer has entered some information and needs to save it.
Pattern Key: SAVE
Example:

Use When: The customer has entered some information and needs to save it.
Solution: As shown in the example.

Saving

  1. The contents of the page or popup window are saved to the database.
  2. If the changes can still be cancelled (as with a popup window that changes values on the underlying window), then an OK button is used instead.
  3. A page is saved as a whole.  Either everything on the page is saved or none of it is.
    Exception:  Surf-to-edit pages are saved separately.  This is actually consistent, because Surf-to-edit pages do not affect the contents of the opening page, but only the choices available.
  4. The entire page is saved at once.  Sections of a page are not saved separately except as described in Edit on Demand.
  5. The Save button may be omitted if not needed, especially if space is very limited.
  6. Recommended:  Either Save & Close or Save & Return is the default button for the page.

See also Confirmation.

Rationale: NA
Accessibility: See Accessibility
Internationalization: See Internationalization
Supporting Examples: None
Where Used: Many places
How to Use: To add a Save or Cancel button to a page in iMIS in a user control that extends UserControlBase, override the CommandButtonRequisites method and call SetNeed on the CommandButtonRequisiteArgs parameter.

Example:

public override void CommandButtonRequisites(CommandButtonRequisiteArgs e) {
     base.CommandButtonRequisites(e);
     e.SetNeed(CommandButtonType.Save);
     e.SetNeed(CommandButtonType.Cancel);
}

To add a Save or Cancel button to a control created by the Screen Designer, check the Save or Cancel checkboxes in the designer.

Items of Note: None

Put to Use

Status: Review

Adherence Rating: Required

Used in Conjunction with: NA

Related Patterns:

Comment viewing options

Select your preferred way to display the comments and click "Save settings" to activate your changes.

Several comments on this one

1. Regarding both b's above, the way I am used to seeing Save and OK work is:
- Save will save the work but not close the screen or move on.
- OK is used only in dialogs and will save the work AND close the dialog. In this case, save the work might mean just write it to the underlying screen (i.e., not save to the database) as described here, but there are cases where a popup will save to the database.

So, I'm thinking that this needs to be clarified, and if doing an actual save in a dialog, maybe use "Save and Close" and "Save" instead of OK.

2. On Saving, item c, I wouldn't say "or it is all lost" but rather "or none of it is". By the way, this is a very important point, possibly deserving of a pattern of its own.

3. We might want to mention that "Save" buttons within sections of a page (i.e., controls or panels) are not allowed. That Save is a page level control.

4. On d above, this may be the result, but is not the right way to describe it. Enter invokes the default button. Save, when present, is typically the default button. But, it is not necessarily so. I would change d to read something like "Save is typically the default button on the screen and as such will be invoked when the user presses the enter key, except when the focus is in a control the uses the Enter key for another purpose.

5. On Confirmation a - I do not think the "Saving" message should appear any longer than it takes to perform the save. Especially when we'll have a confirmation that save succeeded or failed.

In the How To Implement Section add

To add a Save or cancel button to a page in iMIS in a user control that extends UserControlBase, override the CommandButtonRequisites method and call SetNeed on the CommandButtonRequisiteArgs parameter.

Example:

public override void CommandButtonRequisites(CommandButtonRequisiteArgs e)
{
    base.CommandButtonRequisites(e);

    e.SetNeed(CommandButtonType.Save);
    e.SetNeed(CommandButtonType.Cancel);
}

To add a Save or Cancel button to a control created by the Screen Designer, check the Save and/or Cancel checkboxes in the designer.

The graphic needs to be

The graphic needs to be updated

Missing the keyboard shortcut

Enter won't always work, e.g., if focus is in a control that uses it or focus is on another command button. So, I think Save and Cancel each need one like was described here:

http://www.imiscommunity.com/button_add_another#comment-3964

Escape is usually used for cancel.