Show More/Show Less Detail

Version 2.0.0.0 Print this Page
Detail on Demand Pattern Set
 
Description
Return to Top
The Show More/Show Less Detail pattern enables users to toggle between viewing only the required and key fields for a subheader region and viewing all fields where the required and key fields appear in relation to their full context. Required fields that require the user's attention or action must appear in both the Less and More views of this pattern. Required fields that are completed by default and do not require the user’s attention do not need to appear in the Less view of this pattern.
 
Pattern Set Decision Table
Return to Top
  Hover
Details
Dialog Box
Details
Hide and
Show Details
Show More/
Show Less
Detail
Drill-Down
Details
Do the details become a primary resource for users and steps in their tasks? Do the users spend considerable time looking at the details? No No Yes Yes Yes
Do users need to quickly obtain details (glance and close)? Yes Yes Yes No No
Do these details need to be seen in conjunction with the other information? Yes Yes Yes Yes No
How much space do the details use? Small
read-only
form
or data
Does not exceed 512 x 384 pixels A few inches
of screen
real estate
A few inches
of screen
real estate
A page or
more of
detail
 
Key Considerations
Return to Top

Keep these considerations in mind:

  • The Show More view can be a larger form or tabbed region.
  • A common use of this pattern is to take fields from across a set of tabs and show select ones in a Show Less view so that the user can quickly complete the required or key fields. The Show Less view is helpful to show the user only the fields needed to create or identify an object instead of every possible field.
  • In the Show More view, fields should be organized with related fields. The extra fields should not be appended as a separate group. If the extra fields are not directly related, use the Hide/Show Details pattern.
 
Pattern Sample
Return to Top

Show Less View of a Subheader Region

The user can either use the form in this condensed view of the subheader contents or click the Show More link to see the fields in the context of the full subheader content.

Figure 1. Clicking to see fields in the context of the full subheader content
Required Screen Elements
Component Type Required Components Customizable or
Extendable Components
Toggle Link A toolbar divider and a link should follow a subheader titled Show More. Clicking this link toggles the user to a view that shows the full details of the region. The link hides when the region collapses. Content of the region is to be determined by product teams.
Subheader When this pattern is used, the Show Less view of the pattern must be the default. NA
Form The Show Less view must display any required fields not completed by default. Product teams can include other key (but not required) fields that may appear to provide context to the user. Required fields completed by default are not required to appear, but teams can include them if it is required by their use cases.

Show More View of a Subheader Region

The user can either use the form in this full view of the subheader contents or click the Show Less link to see the fields in a condensed view.

Figure 2. Clicking to see fields in a condensed view
Required Screen Elements
Component Type Required Components Customizable or
Extendable Components
Toggle Link A toolbar divider and a link following the subheader title that reads Show Less. Clicking this link toggles the user to a view that shows a select subset of content within the region. The link hides when the region is collapsed. A select subset of content of the region is to be determined by product teams.

The default view (Show More or Show Less) is to be determined by product teams based on their use cases.
Content Area NA The format of the content region is determined by product teams. The format can be a simple form, complex form, subtab, and so on.

 
Related Guidelines
Return to Top
Headers Guidelines for headers and subheaders including show/hide regions
 
About Oracle | Legal Notices | Terms of Use | Your Privacy Rights