Gridpro AB

Rev: 4.1.2114

Published: February 2021

Purpose

The purpose of this document is to provide assistance when customizing forms in WebFront for Service Manager.

Introduction

Starting with version 4.0.7334 of WebFront for Service Manager it is possible to customize forms in WebFront. This enables you to take advantage of your data model extensions, made with the Service Manager Authoring Tool or other method. Form customizations in WebFront for Service Manager is done directly in the browser by a Service Manager Administrator.

Limitations

Current release:

• Only forms available out-of-the-box in WebFront can be customized.

• Generic Form, which is used to show work items and configuration items that don’t have a specific form associated with it, has limited customization functionality. Only show/hide is possible.

Prerequisites

To be able to customize WebFront forms you need to be:

• Running version 4.0.7334 or higher

• Member of the Service Manager Administrator Role*

* If you are not a member of this role you will not be able to see the customization menus in the WebFront forms

Customizing Forms

Form customization is done directly in the browser when working with WebFront for Service Manager. Each form has different zones that can be customized with your different controls bound to your data model extensions. In the following sections, we will go through how this is accomplished.

Launching the Customization Editor

WebFront has a Customization Editor that can be enabled from within each WebFront form.

Figure 1. How to launch the Customization Editor. The Form Customization menu is only accessible as a Service Manager Administrator.

Customization Editor

The Customization Editor consists of the following areas.

Figure 2. Customization Editor – Overview.

Validation(1)
Here you can change if a property or relationship should be required or not.
Note: Properties that are required by the data model in Service Manager cannot be made “not required”.

Add row(2)
Here you can add additional rows with customizations.

Path(3)
Select path to property/relationship you want to add.

Type(4)
Displays path datatype.

Control Type(5)
Lets you select between the supported controls for the path.

Label(6)
Sets the label display name.

Column Span(7)
Specify the number of columns the control should claim. Maximum is 12.

Rows(8)
Specify the number of rows the control should claim.

Custom Tabs

When customizing forms in WebFront you have the possibility to add custom tabs to a form. When added, the custom tabs appear on the left-hand side of the history tab in a form. Each custom tab has its own area which can be customized to visualize data from the Service Manager data model.

Adding a custom tab

WebFront has a Customization Editor that can be enabled from within each WebFront form.

Important when binding to custom relationships (e.g. when using the User Picker)
Class extensions will be available for binding directly after importing them in Service Manager. To be able to leverage a custom relationship in your form customizations, like when using the User Picker, you need to make sure that the relationship is defined as a component in the type projection used by the form you are customizing. Since WebFront uses the same type projections for forms as the standard console, this means that you only need to make sure this is the case in the standard console. The easiest way to do this is to customize the standard console form and bind a User Picker to the custom relationship, since the Service Manager Authoring Tool will create a custom type projection that contains a component based on the custom relationship and associate the form with the new type projection, without you having to know the first thing about type projections and how to associate these with a form.

Customization Example

In this example, we are moving Alternate contact method field by using both hiding fields and add fields.

To launch the Customization Editor form in WebFront

Open WebFront as a Service Manager Administrator

Open an incident

In the task menu to the right, click Customize Form

Click strikethrough eye icon above Alternate contact method to hide the control

Click the pencil in the right corner of the Description field

Click Add Row, then click the plus sign on that row

Select ContactMethod as Path, TextBox as Control Type, Alternate contact method as Label and 12 as Column Span Then click OK

Click Confirm customizations

Click OK or Apply to save

Done

Supported Controls

In this version of WebFront for Service Manager we support the following control types:

• TextBox

• Multiline TextBox

• EnumPicker

• UserPicker

• RelatedItems

• CheckBox

• DateTimePicker

Storage of customization

Form customizations made in WebFront are stored in the Service Manager database.