Designing Forms

You can design a custom form for an artifact. The custom form is applicable to all child artifacts.

To design forms, follow these steps:

  1. In the Specification Templates Workspace pane, click an artifact.
  2. Click the Form Designer tab.
  3.  

    From this page, you can access the following panes:
    • Data Items: This pane displays the available UI elements
    • Properties: This pane displays the properties of the selected UI element in the form designing space
  4. Double-click, or drag and drop an UI elements from the Data Items pane to the designing space.
  5. Select a UI element in the designing space to view and configure their properties in the Properties pane.

  6. The properties differ based on the UI element you select.

    Refer to the following table for property descriptions:

    Property

    Description

    Name

    Specifies the name of the form field.

    For example, combobox260.

    You can change it as per your requirements.

    Label

    Specifies the display name of the filed.

    For example, Status.

    Type

    Specifies the type of form field.

    For example, Combo Box.

    Double-click the corresponding value cell to select an option.

    Visible

    Specifies whether the field is visible on the form.

    Select the Visible check box to make the field visible on the form.

    Enabled

    Specifies whether the field is available on the form.

    Select the Enabled check box to enable the field on the form.

    Mandatory

    Specifies whether the field is mandatory on the form.

    Select the Mandatory check box to make the field mandatory on the form.

    Control Width

    Specifies the width of the control option.

    For example, 95%.

    Double-click the corresponding value cell to change it.

    Label Style

    Specifies the label's text style of the field.

    Click to select a text style.

    Control Style

    Specifies the text style in the input field.

    Click to configure the text style.

    Default Value

    Specifies the default value of the field.

    For example, Draft.

    Double-click the corresponding value cell to change it.

    List

    Specifies the list of values applicable for this field.

    For example:

    • Draft
    • Ready for review
    • Approved

    Click to configure control option and define values.

  7. Also, you can:
    • Click to view form properties
    • Click for preview
  8. Click .
  9. The Master Template Option is saved.

    To understand designing forms, for example, follow the steps to add and configure a radio button:

    1. Double-click, or drag and drop the Radio Button icon from Data Items to the space provided to design the form.
    2. Click the cell containing Option 1.
    3. You can view the properties of the data item.

    4. Double-click the Value cell corresponding to Label and edit it to change the Label.
    5. For example, we changed it to Gender and the form appears as shown below.

    6. Click against the List to edit radio options.
    7. Double-click Option 1 and edit it. Similarly, to edit Option 2 text in the form double-click Option 2.
    8. We edited Option 1 text and Option 2 text and entered Male, and Female respectively.

    9. Click to add more options.
    10. One row is added.

    11. Double-click the cells to enter the option.
    12. Click .
    13. The options in the form are modified.

  10. Click .
  11. The Master Template Option is saved.