Use the global flow with subitems if you want to let the user navigate freely between the main page and multiple subpages in one editing session (one object, such as a sales order as the main object with sales order items as closely related subpages). In this case, the subpages do not have an explicit Save button. Any changes to the subpages are saved automatically in the background (temporary save).  After editing, the user has to navigate back to the main page to save or discard the changes to all subpages. If you want to keep unsaved changes, you need to implement draft handling.

The sections below describe the global flow with and without draft handling.

Global Flow With Draft

Adding a Subitem

The following examples show how to create a new item via the detail screen. You can also use a dialog for creating items. For more information, check out the create page floorplan.

Availability of actions on the subpage:

• Add in footer toolbar: Add navigates the user back to the main page. The entire object remains in a draft state until the user actively saves it. Without draft handling, the object remains in a “dirty state” until the main object is actively saved.
• Back in shell bar: Navigation is allowed.
• Cancel: A quick confirmation popover (data loss) appears.
• Up and down arrows: Not available.

Message toast: “Your changes have been applied.” Confirms that the changes have been transferred to the main page, where the user can actively save the entire object.

Editing Subitems

The following examples show how to switch to edit mode on the main page and on the subpage.

Availability of actions on the subpage:

• Apply in the footer toolbar: The entire object remains in the draft state until the user actively saves it on the main page. Apply always navigates the user back up one level (for example, if the user clicks Apply for a subitem, the app navigates back to the list of items).
• Back in shell bar: Navigation is allowed.
• Up and down arrows: Available.

Main Page:

State of edited line item: Indicator shows Modified. If the user edits a subpage of a subpage and navigates back, the indicator also shows on the main page. For more information about displaying an item in the table, see:

• Responsive table (sap.m.table)
• Analytical table

Message toast: “Your changes have been applied.” Confirms that the changes have been transferred to the main page, where the user can actively save the entire object.

Message Handling

On the main page, validation is triggered when the user clicks Save. If errors occur, the message popover “Item [Item name]: Contains errors” appears. The popover displays errors on the main page and error summaries for all related subpages. Due to technical constraints, the message popover doesn’t support direct links to subpages. To help the user find the item and solve the issue, an indicator in the line item of the table shows which subpage contains errors.

On subpages, validation only applies for the active screen and is executed on focus out, as the Save action is not available. If errors occur, the message popover “[Main Page]: Contains errors” appears, which lists any errors on the active subpage and on the main page. Any errors on other subpages are shown only on the popover for the main page, and not on each related subpage. For more information about the messaging, see message handling.

Global Flow Without Draft

If the global flow is used without draft handling, the interaction stays the same, but the data remains in a “dirty state” until the user actively saves on the main page. This means that data could possibly be lost during navigation between subpages and main page. Therefore we highly recommend using the local flow instead.

Resources

Want to dive deeper? Follow the links below to find out more about related controls, the SAPUI5 implementation, and the visual design.