People Picker
The People Picker control is used to select users and groups. It consists of a text box and a Browse button. The Browse button opens a directory search interface for advanced user and group selection.
Working with a People Picker control
- Create a form as shown in Figure 1, by dragging a ‘People Picker’ control.
Figure 1
- The Properties tab provides options such as allowing multiple selections and excluding groups. The Selected Value property lets users choose the information to display, such as Email, Name, Title, Department, or Mobile Number.
Figure 2
- Preview of a form containing People Picker control is shown in Figure 3.
Figure 3
- Clicking the Browse button opens a window where users can search for and select people (Figure 4).
Figure 4
Designer Properties
| General | |||
| S.No | Property Name | Data Type | Description |
| 1 | Control Name | String | It specifies a unique name for the control within the form. |
| 2 | Control Type | String | It specifies the type of control. |
| 3 | ID | Int | Specifies a unique identifier for the Peoplepicker control. |
| 4 | Text | String | Set the value to be displayed in the control. |
| 5 | Placeholder | String | Specifies the text displayed in the input box when no person is selected. |
| 6 | Tooltip | String | The texts that need to be displayed when the user hover the mouse pointer over the control. |
| 7 | Tab Index | Int | Specifies the order in which the control receives focus when the user navigates through the form using the Tab key. |
| 8 | Remarks | String | To store descriptive notes or comments about the control. |
| 9 | Allow Multiple | Boolean | To allow multiple values in the people picker control simultaneously. |
| 10 | Exclude Group | Boolean | Specifies one or more groups whose members should be excluded from selection. |
| 11 | Group | String | Specifies a particular group from which users can be selected. |
| 12 | Selected Value | String | Sets the value that is to be displayed in the people picker control like Email, Display Name etc. |
| 13 | Value Member | String | It is the property of the selected user(s) that the system uses internally as the actual value. |
| 14 | Check Dirty | Boolean | Determine whether the control’s value has been modified by the user since it was initially loaded. |
| Attached Label | |||
| 15 | Show Label | Boolean | To display the attached label along with the control. |
| 16 | Label Text | String | Specifies the text content displayed in the label attached to the People Picker control. |
| 17 | Label Position | String | Specifies where the label attached to the People Picker control is displayed relative to the control. |
| 18 | Label Width | String | Specifies the horizontal width of the label attached to the People Picker control. |
| 19 | Label Height | String | Specifies the vertical height of the label attached to the People Picker control. |
| 20 | Text Alignment | String | Specifies how the text inside the label attached to the People Picker control is aligned. |
| 21 | V-Text Alignment | String | Specifies how the text inside the label is aligned vertically within the label area. |
| 22 | Margin | String | Specifies the space between the label attached to the People Picker control and other surrounding elements. |
| 23 | Padding | String | Defines the space between the attached label’s content and its border. |
| 24 | Box Shadow | String | It adds a shadow effect around the label |
| 25 | Font | String | Sets the font face\style. |
| 26 | Font Size | String | Sets the size of the text in the attached label. |
| 27 | Bold | Boolean | To make the attached label text Bold |
| 28 | Italic | Boolean | Italicize the attached label text. |
| 29 | Underline | Boolean | Underline the attached label text. |
| 30 | Font Color | String | Specifies the color of the text in the label attached to the People Picker control. |
| 31 | Background Color | String | Specifies the color of the text in the label attached to the People Picker control. |
| 32 | Enable Border | Boolean | Determines whether the label displays a visible border. |
| 33 | Border Thickness | String | Sets the thickness of the border on all sides. |
| 34 | Border Style | String | Sets the border style for the attached label. |
| 35 | Border Color | String | Sets the border color for the attached label. |
| Style | |||
| 36 | Width | String | Specifies the horizontal size of the control on the form. |
| 37 | Height | String | Specifies the vertical size of the control on the form |
| 38 | Margin | String | Sets the space between the control and surrounding elements on the form. |
| 39 | Padding | String | Refers to the space inside the control between its border and its content. |
| 40 | Box Shadow | String | Defines the shadow effect around the control’s container, giving it a sense of depth or elevation. |
| 41 | Enable Custom Font | String | Allows the control to use a custom font specified by the developer instead of its default font. |
| 42 | Font | String | Sets the font face\style. |
| 43 | Font Size | String | Set the font size. |
| 44 | Font Color | String | Specifies the color of the text displayed inside the control. |
| 45 | Background Color | String | Specifies the color that fills the background of the control. |
| 46 | Visible | Boolean | Sets the visibility of the control while rendering. |
| 47 | Enable | Boolean | Sets the accessibility of the control during rendering. |
| 48 | Bold | Boolean | To make the control text Bold. |
| 49 | Italic | Boolean | Italicize the control text. |
| 50 | Column Span | Int | Specifies the number of columns the control spans in a grid. |
| 51 | Corner Radius | Int | Defines the roundness of the control’s corners. |
| 52 | Enable Border | Boolean | Determines whether the control displays a visible border around it. |
| 53 | Border Thickness | String | Sets the thickness of the border on all sides. |
| 54 | Border Style | String | Sets the border style for the control. |
| 55 | Border Color | String | Sets the border color for the control. |
| Rules | |||
| 56 | Rules | After selecting the control, if the user clicks the Rules tab it will be expanded and displays a Rules property. Create Rule can be selected from a drop-down list. On clicking the Create Rule link button will navigate the user to the Rules Engine. The same control will be added as a trigger by default to execute the Rule. | |
| Validation | |||
| 57 | Is Required | Boolean | Helps to check whether the user has to give input in the control or not. If this property is enabled, this will not allow the user to save a form without giving the input. |
| 58 | Required Message | String | If the Is Required property was enabled and input was given in this property, the validation message will be displayed to the next right of the control when the user is trying to save a form without entering a value in the control. |
| 59 | Message Position | String | Defines the placement of messages or notifications related to the Peoplepicker control, such as error prompts or helper text, relative to the control. |
| Reports | |||
| 60 | Control Report | The Control Report redirects to the Reports tab, displaying all configurations, rules, and datasource details associated with the selected control. | |
| Template | |||
| 61 | Inherit Template | Boolean | Determines whether Peoplepicker control uses the visual template of its parent or base control. |
| Custom Style | |||
| 62 | CSS Class | String | The CSS Class property allows you to assign one or more CSS classes to Peoplepicker control for styling purposes. |
| Custom Property | |||
| 63 | HTML Attribute | String | The HTML Attribute property allows you to add custom HTML attributes to Peoplepicker control when it is rendered on a web page. |
| Responsive Options | |||
| 64 | Template Name | String | Represents the template name of the control shown in the Responsive UI configuration. The template name is the same as the control’s name. |