Creating & Updating Layouts

Once a layout type has been defined, you can create new layouts from the Design Center.


Design Center

Note:

  1. If you want view or update the layouts specific to an individual user role, you can choose from the select list entitled Select User Role. If you select the default layout for all roles, you will see the layouts that are used unless a role is specifically designed for a specific user role
  2. Use the select lists to choose the Business Area and Project for the layout you want to add or to edit
  3. The select list named Add a new layout for the entire system allows you to add a new layout, from the list of available layouts, for this combination of Area, Project, and user role. If a layout for this combination already exists, it will not appear in the select list, but it appears in the lower half of the screen, with an edit button alongside
  4. Clicking on the Edit button allows you to alter and update the layout.

Note: The edit function allows you to delete layouts, whether they were created by yourself as an administrator, or created by ExtraView. You should not delete an ExtraView created layout. ExtraView will not function correctly if you do so.

Role-Based Layouts

  1. If you are not selecting a layout that will be used as the default across all user roles, select the user role to which the layout will apply from the select list at the top of the screen. Note that you can clone a layout for a different user role by editing an existing layout, altering the user role to which it belongs and saving the layout
  2. To add a layout where an existing layout of the same type already exists, click the Edit button beside the existing layout type example you would like to use. If no layout of an available type currently exists, select the desired layout type from the Add new layout drop down select list. You can then perform a "save as" operation

    3. Editing Operations Within a Layout

    When you click the Edit button, a screen similar to the following appears:


    Design Center Screen

    1. Save Button - Saves the current layout, leaving the administrator within the layout
    2. Delete Button - Deletes the current layout. You must confirm the operation before the layout is deleted
    3. Clear Button - Clears the current layout of all fields
    4. Preview Button - Opens a preview of the layout in a new window. Note that the preview is only an approximation of the layout as it will be rendered, and does not utilize layout cell attributes such as FIELD/LAYOUT VISIBLE IF
    5. Return Button - Return to the initial Design Center screen with the list of layouts
    6. Print Button - Print the contents of the current window
    7. Expand Layout Attributes toggle button - this opens a section similar to this:

      • The Advance By option allows you to set a direction to advance the placement of a field as you place these on the layout, to column or row
      • The Tab Order By option allows you to set the order for tab control by end users entering data into the form. This can be by column or by row
    8. The main grid where selected fields are shown in the position where they will be rendered on the layout
    9. The title for the layout
    10. The description of the layout
    11. Localize button - this only appears if localization is turned on for the installation
    12. Layout Options toggle - when this is clicked, a section similar to this opens:

      Use the select lists to alter the role, layout type, business area or project where you want to store the layout, as a "save as" operation

    13. Invert field list button - this button toggles the field list so that field titles are displayed in order, as opposed to displaying their names
    14. Minimize field/layout lists - this button toggles the field and layout lists, to reduce their appearance to a single row on the screen
    15. Unpin field/layout list - this button upins the field and layout lists so they may be moved around the screen with the mouse
    16. Field filter list - selecting this will display allow the filtering of the field list to a single field display type

    17. Find a field - start typing into this field and all fields in the list that match the pattern will be displayed, and all other fields will be dropped from the list
    18. New field button - this brings up the data dictionary screen to add a new field. When you first click the button, you are asked if you are creating a new Field, Expression, Label or Screen field
    19. Minimize field list - this button toggles the field list, to reduce its appearance to a single row on the screen
    20. Field list - this scrollable list shows all the available fields that you can drag and then drop on the main grid. Fields may be dropped on any empty location in the main grid. If you right-click on a field name, you will see details of the field. Note the Edit button. When you click this, a window will open showing the field in the data dictionary. You can make any modification you require to the field and its attributes at this point.

    21. Layout List - clicking on this list will allow you to filter the list of layouts, to only display one of the categories (screen, report or search)

    22. Find a layout - start typing into this field and all layouts in the list that match the pattern will be displayed, and all other layouts will be dropped from the list
    23. New layout type button - this brings up the layout type screen to add a new layout type
    24. Minimize layout list - this button toggles the layout list, to reduce its appearance to a single row on the screen
    25. Layout list - this scrollable list shows all the available layouts that you can drag and then drop on the main grid. Layouts may be dropped on any empty location in the main grid. If you right-click on a field name, you will see details of the field. Note that layouts you have created will have a Permission button. When you click this, a window will open allowing you to modify the permissions to the layout. You can make any modification you require to the field and its attributes at this point.

    26. Insert column to left button - Insert a new column to the left of the button
    27. Delete column button - Delete the column
    28. Insert column to right button - Insert a new column to the right of the button
    29. Insert row above button - Insert a new row above the button
    30. Delete row button - Delete the row
    31. Insert row below button - Insert a new row below the button
    32. Cell details area - within this area, you will see details of any cell selected in the main grid, and you can alter layout cell attributes and change the permissions to a field
    33. Minimize cell details - this button toggles the cell information, to reduce its appearance to a single row on the screen
    34. Unpin cell details - this button upins the cell details so they may be moved around the screen with the mouse
    35. Cell attributes area - This is the area where all the layout cell attributes are managed. Click on a cell in the main grid to select it as shown in the screenshot below, and the cell details panel will display all the information about the cell

    36. New layout cell attribute button - Click this button to add a new layout cell attribute. See the section on layout cell attributes for information on managing these
    37. Minimize layout cell attributes button - this button toggles the layout cell attributes information, to reduce its appearance to a single row on the screen
    38. Field & Layout Attributes area - as shown above, this area will display data dictionary information on the selected cell in the main grid
    39. Security permission button - click this button to popup a window on the currently selected cell's security permissions. This is described in full in the security permission section of this guide
    40. Minimize Field and Layout Attributes button - this button toggles the Field and Layout Attributes information, to reduce its appearance to a single row on the screen

    Field Manipulation on the Main Grid

  • Selecting a field - click on the background to the cell
  • Moving a cell - click on a cell and drag it to a new, empty location on the main grid. Note that any layout cell attributes to the field within the cell will be moved along with the field itself
  • Removing a cell from the main grid - click on the background to a cell and drag it back to the field list.
  • Layouts - perform similar actions as those above to manipulate layouts
  • Extending a cell over multiple columns - click on the right-hand edge of the cell and drag the edge to the right over empty cells. Release the mouse over the rightmost cell to which you want to extend the cell
  • Extending a cell over multiple rows - click on the bottom edge of the cell and drag the edge downwards to the bottom row to contain the cell. Release the mouse

Duplicate Fields on Layouts

It is not permitted to have the same field be included on the same or different layouts that are grouped together. ExtraView catches a field duplicated within a single layout, but cannot catch the situation when a field is duplicated by virtue of being contained in an embedded layout. The reason for this is that when you create an embedded layout, it may be included in any one of a number of other layouts, and each of these may or may not have the field duplicated.

The error of duplicated fields can therefore only be caught at runtime. When testing your installation, you may see an alert message similar to the following screenshot:

The above example shows that the field named DESCRIPTION is duplicated. First it is included on the ADD_PROBLEM layout, and then on the embedded Details layout. Further, the ID of the Details layout is displayed.

You must resolve the duplication by removing one of the fields from one of the layouts before your installation will function correctly.

Using the Layout Description as the Title to Add and Edit Screens

The Description field on Add and Edit layouts has a special property. It may be used as the title to these screens, allowing the administrator to provide different titles for each Add and Edit screen. For example, you might give the Add and Edit screens different titles in different Business Areas. The standard behavior is that the title of the data dictionary field for the screen is used as the screen title. If you give a title of $$LAYOUT.TITLE$$ to any of the following fields, then the layout description will be used as the title to the screen as it is rendered.

  • ADD_PROBLEM - The Add Issue screen
  • ADD_PROBLEM_SUMMARY - The Add Issue Verification screen
  • EDIT_ISSUE_SUMMARY - The Edit Issue screen

Layout Rendering

The layouts will be rendered by the user's browser when they navigate to the appropriate function for the layout. Note that if ExtraView sees that an entire row of cells are empty, i.e. there are no values with write permission, and there are no values to render with read-only permissions, then the entire row is suppressed and is not rendered.