Adaptive Forms

Adaptive Forms

PMWeb’s Adaptive Forms let you quickly and easily design, build, and deploy virtually any kind of form within our award winning project management platform. Simply drag and drop sophisticated controls onto the design canvas, configure them with a few clicks, and immediately see what your form will look like on various devices. Adaptive forms can then be shared with any PMWeb users you wish. You can build improved versions of the forms you already use or invent entirely new ones.

This document outlines in general terms the process of designing Adaptive Forms and using them within the PMWeb application. For more information, please consult PMWeb online help and your PMWeb implementation consultant or trainer.

PMWeb Adaptive Form
Figure 1 – PMWeb Adaptive Form

The Designer Tab

The general workflow for creating an Adaptive Form is to:

  • Click the Form settings button and use the Settings pane to set form basics
  • Complete the Title section by typing over the default title and subtitle and selecting a logo
  • Drag a control from the Controls tree on the left side of the Design tab
  • Drop it on the Design canvas in the center of the page
  • With the control still selected, configure it using the Settings pane on the right side of the page
The Adaptive Forms Designer Tab
Figure 2 – The Adaptive Forms Designer Tab

Form Level Settings

Key settings at form level include:

  • Module – Select a PMWeb module from the list. The Adaptive Form will appear under that module in the main menu.
  • Form language – Select the default language for the form. You can use the Translation tab to translate the form into other languages.
  • Width settings – Determine the adaptive behavior of the form and its default width
  • Navigation – Set behavior for navigating page to page
  • Field – Set default layouts for controls added to the form
  • Pages – Add and edit pages
  • Validation – Determine when your validation rules are run
  • Logic – Create calculated values and custom triggers

Controls

The Controls tree is organized by category.

System Fields

  • Level – Adaptive forms can be assigned to System, Project Program, Project, Initiative, Location Program, or Location level. The choice you make here determines the most basic security for the form as well as what types of PMWeb data you can use on it.
  • System List – Drop this control on the form and then use the System section in the Settings pane to link to an existing PMWeb list
  • Status, Record Number, and Description are standard fields that appear on most other PMWeb record types

General Controls

  • Dropdown – Use this control to define a list of values within the form for users to select from. If you want values from predefined PMWeb lists, use the System List control in the System Fields section.
  • Multi-Select Dropdown – The same as above but with the option for users to select multiple values
  • File upload – Prompt users to upload one or more files and use settings to determine which file types will be accepted
  • Checkboxes, Yes/No switches, radio buttons, and many more general controls are available

Text Controls

  • Add single-line, memo, and grouped text fields to the form

Containers
These are panels that let you group controls on the page

Matrixes

  • Single-Select Matrix – Great for ratings tables, with multiple lines and multiple columns to select from
  • Multi-Select Matrix – Create tables with a fixed number of lines and multiple columns of different data types
  • Dynamic Matrix – The same as the Multi-Select Matrix, but allowing the user to add lines

Misc

  • Expression – Display custom calculations
  • Image – Display a preselected image
  • Signature – Provide a digital block for the user to write a signature

The Settings Pane

To use the settings pane, click on a control in the design canvas to select it, and then use the options in the pane to configure the control. The settings that appear in the pane vary, depending on the control that is selected in the canvas. You can also click the Form Settings button to view and edit form-level settings in the pane.

The Preview Tab

Use this tab to preview what your form will look like on various devices. You can also practice entering data in the controls to see how they will behave.

Immediately Preview your Adaptive Form on Various Devices
Figure 3 – Immediately Preview your Adaptive Form on Various Devices

The tab includes these Preview buttons:

  • Device Type – Select from a list of devices
  • Orientation – Switch between portrait and landscape orientation on the same device
  • Invisible Elements – Show or hide invisible controls

The JSON Editor Tab

All of the data in a PMWeb Adaptive Form is saved in a single data file in the JSON format. That data appears in the JSON tab.
You can copy the data and then paste it into a new form to make an exact copy.

The Translation Tab

The Translation Tab
Figure 4 – The Translation Tab

Click the Add Language button and select a language from the list to add a translation. A new column for that language automatically appears in the Language columns section, alongside the default. For each element in the language column, type a translation. You can also use the Import/Export buttons to translate via .csv files.

The Assign Permissions Tab

Use this tab to assign security rights to PMWeb users, by group or individually.
Figure 5 – Adaptive Forms work just like PMWeb System Forms

Adaptive Forms work just like PMWeb System Forms
Figure 5 – Adaptive Forms work just like PMWeb System Forms