Processing Form: General Information

On a processing form, a user can perform an operation on multiple selected records at once. A processing form can include the following parts:

  • An optional Selection area, which can include elements to narrow the listed records and elements that affect how the processing occurs.
  • A table (which we will refer to as a grid in this chapter).
  • Optional grid filters (also known as quick filters) that are displayed above the grid. For details, see Filtering Area and Quick Filters in the Interface Guide).

This topic provides recommendations and guidelines on organizing the layout of a processing form. The following screenshot shows an example of a processing form with a Selection area and a grid.

Figure 1. A processing form

Learning Objectives

In this chapter, you will learn how to do the following while defining a processing form:

  • Organize the layout of the processing form
  • Configure the processing form in HTML and TypeScript

Applicable Scenarios

You configure the processing form in the following cases:

  • You are migrating an existing processing form to the Modern UI.
  • You are creating a new processing form by using the Modern UI.

Recommendations for Organizing the Layout

By default, you should do the following while designing a processing form:

  • For the Selection area, use the 17-17-14 template.

    For more details about templates, see Form Layout: Predefined Templates.

  • For the grid area, use the primaryInquiry preset.

    For details about presets, see Form Layout: Grid Presets.

  • Do not display Activities, Files, and Notes buttons on the form title bar.
  • Do not display Files and Notes buttons in the grid.
    Note: However, in rare cases, you may need to add the Notes and Files buttons for a processing form. For example, on the Process Export Scenarios (SM207035) form, using the Files button is the only way a user can download an exported file.
  • Use captions for sections in the Selection area only if it makes sense to do so (that is, if the captions help the user to understand the way the elements are used).

The following table shows recommendations for organizing the layout of a processing form.

Correct Incorrect
Put all commands on a single toolbar.

Do not separate commands into two toolbars.

Use a single field tag for an element with the Date Range label and two date and time controls for the selection of the start date and the end date.

Do not use two separate fields in a fieldset for the Start Date and End Date boxes on processing forms.

This approach applies only to processing forms.

UX and Functional Guidelines

The form design should be tailored for screens with a resolution of 1280 x 720.

The number of a processing form should start with 50. For details, see Form and Report Numbering.