The Applicant Info control is used to display the requester's user profile information of an approval form. You can choose to display any fields of the user's profile in the Application Info control, like the user name, email, department, line manager, jot title etc.
Another important feature which's included in the Applicant Info control is about the Delegation. You can turn on the delegation setting on this control to allow the submitter choose another user as the applicant of this approval form. For example, allow users to submit a leave request on behalf of someone else.
Add the Applicant Info control
Firstly, open the Approval form designer and find the Applicant Info control in the group of "Workflow controls". Then, drag and drop it into a section or container on your form designer.
Basic of the Applicant Info
Open the Content > Basic block and set the text of Title. This title will be displayed on the Caption of this Applicant Info control.
Appearance of the Applicant Info
Open the Content > Appearance block to set the appearance and layout of this Applicant Info control.
Number of Columns: Set the number of columns to display those user profile info.
User Profile: Click the "Settings" button to select which fields will be included in this Applicant Info control, and set the display orders. You can also customize the field display names.
Delegation: Turn this option ON will allow the submitter to select another user as the Applicant, otherwise, the Applicant will be the same user of the submitter.
Applicant scope: Set the scope of users which are allowed to be selected from this user field:
All: Allow to select users from all users existing in your organization:
Specific users: Allow to only select from the list of users specified here.
Variable: Allow to select users from a variable. You can open the expression editor to select from one pre-defined variable, Instance context, a user group or one position.
Display Caption: Choose whether display the caption or not. Turn this OFF will hide the caption.
Collapse: When the caption is set to display, you can choose whether allow this Application Info control be collapsed.
Display Title: Choose whether display the title or not. Turn this OFF will hide the title.
Title Layout: Choose how to display the Title of each field in this Applicant Info. You can set the title display on top or left of each field value.
Title Width: Set the width of each title in PX , %, em, rem, vw, calc.
Dynamic Display Rules: Setting rules can have dynamic fields, grids, and even forms. Learn how to create dynamic display rules for a control.
Action call of the User field
Open the Content > Action block to call a predefined action from the dropdown list. This action will be triggered once the applicant is changed.
Style the Applicant Info control
Field
Open the Style > Field block to set the styles of the fields' values.
Typography: Set the typography options for the text of the fields' values.
Color: Set the color for the text of the fields' values.
Background Color: Set background color of the fields' values. By default, the background color is set as transparent.
Align: Set the alignment of text inside the fields' values. Can be Left, Center or Right.
Padding: Set the Padding of the fields' values.
Border Type: Select the type of border, choosing from none, solid, double, dotted, dashed, or grooved.
Radius: Set the border radius to control corner roundness.
Select Applicant
Open the Style > Select Applicant block to set the styles of the user control which will be used to select applicant when the delegation is set ON.
Typography: Set the typography options for the text in the user picker control.
Normal / Focus:Set different styles for normal state and focus state of the user picker. Styles below are supported to be set separately for Normal and Focus state.
Color: Choose the color of the field's text.
Background Color: Set background color of the field. By default, the background color is set as transparent.
Border Type: Select the type of border, choosing from none, solid, double, dotted, dashed, or grooved.
Radius: Set the border radius to control corner roundness.
Shadow: Adjust box shadow options
Operation Button:Set the styles of the operation button after the text box.
Color: Select the color of the button’s text
Background Color: Select the button’s background color.
Placeholder Color: Choose the color of the placeholder text.
Align: Set the alignment of text inside the field control. Can be Left, Center or Right.
Padding: Set the Padding of the field control.
Field Width: Set the width of the field control in PX , %, em, rem, vw, calc.
Field Alignment: Set the alignment of the field control. This will only be effected when the field width is less than the outside container.
Selected items: Set the styles of the selected users.
Margin: Set the Margin of the button in PX , %, em, rem, vw, calc.
Padding: Set the Padding of the button in PX , %, em, rem, vw, calc.
Typography: Set the typography options for the text of selected users.
Color: Select the color of the selected users.
Background Color: Select the background color of the selected users block.
Border Type: Select the type of border, choosing from none, solid, double, dotted, dashed, or grooved.
Radius: Set the border radius to control corner roundness.
Shadow: Adjust box shadow options.
Style of title
Set the Title of field controls that are applicable to this control.
Style of Caption
Margin: Set the Margin of the Caption in PX , %, em, rem, vw, calc.
Padding: Set the Padding of the Caption in PX , %, em, rem, vw, calc.
Background Type: Select the background color. You may use a solid or gradient color.
Border Type: Select the type of border, choosing from none, solid, double, dotted, dashed, or grooved.
Radius: Set the border radius to control corner roundness.
Shadow: Adjust box shadow options.
Title: Set the styles of the Title on Caption,
Typography: Set the typography options for the title text.
Color: Choose the color of the title text.
Icon: Set the styles of the Icon of expand or Collapse this control,
Color: Choose the color of the Icon.
Size: Set the size of the Icon.
Advanced Settings
Set the Advanced options that are applicable to this control.