Mass Editing

Intro

Mass editing allows users to change multiple (homogenous) objects simultaneously. Usually, these objects are selected from a list or table and have most or all of their changeable facets in common, such as Object Name, Object ID, or Description.

By aggregating all the values for each of these facets, users can quickly choose to either keep or overwrite them.

Usage

Use mass editing if:

Do not use mass editing if:

Components

The two main controls used during mass editing are the combo box and the select control. Mass editing is usually done in a dialog. However, in a split-screen layout, multiple items can be selected in the master list and edited directly in the details section without the need for a dialog.

Both the combo box and the select control are used to aggregate multiple values of the objects to be edited. The combo box allows the user to enter values that differ from the existing values. By contrast, the select control limits the user’s choice to a predefined set of values.

Behavior and Interaction

Mass editing can generally be applied to any type of editable object facet.

Example: Editing a list of employees

  1. The table contains 10 employees. While they all share the same columns, the values for each entry are usually different. There are of course exceptions, for example, if some employees have the same name.
  2. All the columns can be represented as combo boxes or select controls. If the values in a given column differ, the user selects < Keep Existing … >. If all the values are identical, the respective value is shown directly (see Website or Salary).
  3. A combo box allows the user to type in a new website for all employees, leave the field blank, or keep the previous values. In this case, the latter is identical to selecting sap.com. This entry allows users to undo any changes they may have made. It is especially helpful if many preset entries are available and the user is unsure of what the original value was.
  4. A select control restricts the user’s choices to the presets shown – no free text input is possible. Because of the different employee ratings, < Keep Existing Ratings > is preselected.

From Regular Editing to Mass Editing

The transition from regular editing to mass editing is very simple. The existing values are listed in a combo box or select control, depending on whether the user is allowed to add a custom entry or the choice is restricted to a predefined set of entries.

If the values of the selected objects differ from one another, the entry < Keep Existing … > is preselected, where “” stands for a specific text related to the content of each field. For more information, see the text recommendations.

If all the values are identical, that specific value is used as the preset value.
Exception: If the original input controls have all been left empty, the entry < Leave Blank > is preselected.

Only offer < Leave Blank > if the input fields for the original objects are allowed to be left empty.

In the screen below, you can see the table from the first example. To edit a name, a user would usually select (or navigate to) one employee and click Edit. In edit mode, the employee’s name is represented as two input fields for the first and last names.

If, for example, the user wants to edit all the last names at once (mass editing), all the last names are aggregated into a single combo box (in the top right-hand corner). Because of the many different values, the preselected entry is < Keep Existing Names >.

In the dropdown list, all the values (last names) are listed in alphabetical order, without duplicates. Selecting one of these names overwrites all the last names with that entry.

If permitted (by the design and the back end), the user can select < Leave Blank > to put a blank value into this field for all the employees.

In this example, a combo box was used, so the user can also type in a new value that is not represented in the dropdown list. All the existing last names are then overwritten with the newly-entered value.

If the user is not allowed to enter a custom value, use a select control instead of a combo box. All the permitted values must be listed in the dropdown list.

Example: From list to combo box

Example: From list to combo box

The following list shows how to “translate” controls into their mass editing equivalent. Each control is represented in two sections:

Example of the control’s use.
“Translation” for mass editing.
Description of which control to use and how to choose the preset entry.

Checkbox

Checkboxes

Checkboxes

Checkboxes – Editing

Checkboxes – Editing

Control

Select

Preset Entries

Mixed choices: < Keep Existing Settings >

All checked: Yes

All unchecked: No

Composite Fields

Composite fields

Composite fields

Composite fields – Editing

Composite fields – Editing

Control

Combo box/Select (depending on use case)

Preset Entries

See respective control in the list above.

Date Picker

Date picker

Date picker

Date picker – Editing (1)

Date picker – Editing (1)

Date picker – Editing (2)

Date picker – Editing (2)

Control

  1. A) Select (if users are only allowed to pick a date from a predefined list)
    List all allowed dates beneath the standard actions.
  2. B) Combo box (if users are allowed to pick any date)
    Right above the list of dates from the object, offer another selection
    < Select New Date >.
  3. Dialog with calendar control inside
    Selecting a date and clicking OK closes the dialog and populates the combo box with that date.

Preset Entries

Mixed entries: < Keep Existing Dates >

Identical entries: Use this entry as preset.
Exception – all blank: < Leave Blank >

Input (any characters allowed)

Input (all characters)

Input (all characters)

Input (all characters) – Editing

Input (all characters) – Editing

Control

Combo box

Preset Entries

Mixed entries: < Keep Existing Email Addresses >

Identical entries: Use this entry as preset.
Exception – all blank: < Leave Bank >

Input (restricted to specific characters, such as numbers)

Input (restricted characters)

Input (restricted characters)

Input (restricted characters) – Editing

Input (restricted characters) – Editing

Control

Combo box

Preset Entries

Mixed entries: < Keep Existing Values >

Identical entries: Use this entry as preset.
Exception – all blank: < Leave Blank >

In this case, use a combo box even though only certain characters are allowed. This is necessary to make the topmost entries < Keep Existing Values > and < Leave Blank > work and allow the user to select them via text input.

Be sure to validate the entry when the field loses focus or the user presses the ENTER key.

Input (with value help or select dialog)

Input (value help)

Input (value help)

Input (value help) – Editing

Input (value help) – Editing

Control

Combo box (Add < Use Value Help > or < Use Select Dialog > entry to trigger the respective dialog.)

Preset Entries

Mixed entries: < Keep Existing Values >

Identical entries: Use this entry as preset.
Exception – all blank: < Leave Blank >

Input (multi input)

Input (multi input)

Input (multi input) – Editing

Input (multi input) – Editing

Radio Buttons

Radio buttons

Radio buttons

Radio buttons – Editing

Radio buttons – Editing

Control

Select

Preset Entries

Mixed choices: < Keep Existing Selections >

Identical choices: Use this choice as preset.

Rating Indicator

Rating indicator

Rating indicator

Rating indicator – Editing

Rating indicator – Editing

Control

Select

Preset Entries

Mixed choices: < Keep Existing Ratings >

Identical choices: Use this choice as preset.

Segmented Button

Segmented buttons

Segmented buttons

Segmented buttons – Editing

Segmented buttons – Editing

Control

Select

Preset Entries

Mixed choices: < Keep Existing Settings >

Identical choices: Use this choice as preset.

Slider

Slider

Slider

Slider – Editing

Slider – Editing

Control

Combo box / Select

Preset Entries

Mixed values: < Keep Existing Values >

Identical values: Use this value as preset.

Sliders potentially offer hundreds of values. These should not all be represented in the dropdown. Use a combo box and try to offer some appropriate presets as shown above and allow the user to enter other values (the user’s input needs to be validated).
If your slider only has up to 10 steps, you can also use a select control and offer all possible values in the dropdown.

Switch

Switch

Switch

Switch – Editing

Switch – Editing

Control

Select

Preset Entries

Mixed choices: < Keep Existing Settings >

Identical choices: Use this choice as preset.

If the semantic switch is used, make sure you provide suitably worded options for mass editing, like On/Off or Yes/No.

Toggle Buttons

Toggle buttons

Toggle buttons

Toggle buttons – Editing

Toggle buttons – Editing

Control

Select

Preset Entries

Mixed choices: < Keep Existing Settings >

Identical choices: Use this choice as preset.

Currently, mass editing is not supported for time selection, since the respective control has not yet been adapted.

Guidelines

General Guidelines

Text Recommendations

Define a specific “Keep Existing …” text for the content of each field. In some cases, your text may also depend on the input type. See the table below for examples:

Type of Input
Example Field Label
“Keep Existing …” Text
Checkbox
Automatic Billing
Keep Existing Settings
Date
Date of Birth
Keep Existing Dates
EMail
Customer EMail
Keep Existing E-Mail Addresses
Image
Product Image
Keep Existing Images
Number
Price
Keep Existing Prices
Quantity
Keep Existing Quantities
Width
Keep Existing Widths
Unit of Measure [kg, km, litre, …]
Keep Existing Units
Volume (cubic measures)
Keep Existing Values
Distance
Keep Existing Distances
Radio Button
Gender
Keep Existing Selections
Rating
Supplier Rating
Keep Existing Ratings
Segmented Button
Security Level [All, Internal, Confidential]
Keep Existing Settings
Slider/Range Slider
Upper/Lower Price Limit
Keep Existing Values
Switch
Include Simulation Run [On, Off]
Keep Existing Settings
Text
Product Description
Keep Existing Descriptions
Plant ID
Keep Existing IDs
Available In [select a country]
Keep Existing Countries
Customer Name
Keep Existing Names
URL
Company Website
Keep Existing URLs

Special Characters (“<” and “>”)

The entries < Keep Existing … > and < Leave Blank > should always be used as described in this guideline: They must start with “<” followed by a blank space, and end with a blank space followed by “>”.

These two characters have been chosen because they are not usually used in text form in objects.

In the unlikely event that these characters are already used by a customer, replace them with another set of unlikely special characters that are not used by this customer. However, you must still ensure that < Keep Existing … > and < Leave Blank > stay at the top as the first two entries.

< Leave Blank >

Only offer the < Leave Blank > option in the dropdown list if the user is explicitly allowed to leave a field empty and the back end supports it.

If a field (such as Name) is empty for all selected objects, it is better to preselect < Leave Blank > instead of showing an empty combo box or select control, and having a blank entry in the dropdown list. Even though this is not entirely consistent, it still provides a better user experience.

Resources

Elements and Controls

Implementation

Visual Design

  • No links