Creating two-column detailed views

This topic explains how to create and update two-column detailed views using the WUI view editor.

The WUI view editor has been updated to enable the creation and update of two-column detailed views. The Add View screen of the view editor has been updated to include a new view type called Two column detail form. The Detail form type of previous releases has been renamed One column detail form.
The process of creating a new view is much the same as in previous releases. This is an outline of the steps you need to follow to add a new two-column detailed view to an existing view set:
  1. Open the view editor and navigate to the Add View screen.
    1. From the Main menu navigation panel, click View editor > View sets > Edit. This opens the Open View Set screen.
    2. Select the view set to which your new detailed view will belong and click OK.
      Note: Remember, it is not possible to change an IBM-supplied view set or view unless you copy and rename it first.
      This opens the View Set Contents screen, which contains a list of the views currently belonging to the selected view set.
    3. Click Add at the bottom of the screen. This opens the Add View screen, which is used to create a new view for the selected view set.
  2. Name the new view and define its type.
    1. Type in a name for your new view in the View name field.
    2. Select Two column detail form from the list of view types.
    3. Select Key attributes from the list of pre-fill options and click OK. This opens the Detailed Form Components screen.
  3. Add an attribute to the left column

    When you choose to add an item to a two-column detailed view, the new element is placed in the left column. In order to maintain left-right alignment a white space element is automatically placed in the right column opposite the new item.

    1. Select Form contents. This opens a Form Contents screen similar to the one in Figure 1. Notice it contains a Space element type, which is necessary in the creation of two column screens in order to balance the right and left columns.
      Figure 1. Form Contents screen for a two-column detailed viewThis screen allows you to append, insert, edit and delete screen elements for a two-column view.
    2. Click Append. This opens the Form Item Type screen.
    3. Select Attribute field and click OK to open the Form Attribute Field screen.
    4. Select an attribute from the list and click OK to open the Form Item Components screen.
    5. Complete the definition of the new attribute by:
      • Typing in the attribute title and any annotation
      • Selecting the display options; either normal or graphical
      • Adding any view links.
    6. Click Finish to add the new attribute to your new view. This takes you back to the Form Contents screen.
  4. Add another attribute to the right hand column of the view.

    In order to add an element to the right hand column, you need to select a white space element and then edit it to change it to the type of element required:

    1. Select the white space element created in step 3 and click Edit. This opens the Form Item Type screen again.
    2. Select the type of element you want to add to the right hand column and follow the procedure outlined in step 3 to define it.

      Click Finish to add the right hand element to the view

    You can repeat steps 3 and 4 as many times as necessary to add more elements to the left and right columns.
    If you want to remove an item from the right hand column, select it and click Delete. This converts the item back to a white space element.
    Note: You cannot delete an individual white space element but you can remove adjacent elements in both columns by clicking Delete row.
  5. Complete the view definition.
    1. Click OK on the Form Contents screen to return to the Detailed Form Components screen.
    2. Now add the rest of the components of the new view including a title, action buttons, filters, context and scope and so on.
    3. When you have added all the required components, click OK to save the new view and return to the View Set Contents screen.