- 15 Oct 2024
- 6 Minutes to read
- Print
- PDF
File Upload
- Updated on 15 Oct 2024
- 6 Minutes to read
- Print
- PDF
File Upload control enables the form consumer to upload any document(s) of the accepted file type within the defined maximum file size limit.
Figure: File Upload Control
Use Case User Persona: Application Designer | Solution |
Novatech, has a requirement to attach the licensing documents while adding a new asset to the system. | Application Designer can drag and drop the File Upload control on the form and configure its properties accordingly. He can attach multiple files (max 5) and the allowed file types are PDF, Word, and JPEG. |
Configure File Upload
To configure File Upload Control, perform the following steps:
Navigate to Form Designer > Design Form > Controls.
Expand Form Controls to locate the File Upload control.
Drag and drop File Upload control on the design canvas. Hover over the added control to access the Settings and Delete icon.
Figure: File Upload Control
Icon
Description
Settings icon will enable the Application Designer to configure the Switch Control in the Main Form.
Delete icon will delete the Switch control from the Main Form.
Controls for adjusting the size of Switch on Canvas.
Click Settings icon to configure the File Upload control. On the Settings pop-up window, the following tabs can be configured.
Properties
The properties of File Upload display the following sections:Figure: Properties
General
In this section you can define the general properties of the File Upload control such as Title, Subtitle, File Extension Properties, Maximum File Size and Allowed File Types.
For the field description, refer to the following:
Enter Title of the File Upload as it must be displayed in the Form.
Example: If you want to upload attachments, then you can title the File Upload control as Attachment.Figure: Title attribute in General of File Upload control
Note
If you change the Title name, the File Upload control name changes according to Title name on the top. This is displayed in the previous figure.
Enter Sub Title.
This is a brief description for the file upload control, providing context about its purpose or the type of files users should upload. It appears directly below the control.
Figure: Sub Title in General properties of File Upload control
The following figure displays Sub Title on the Form Canvas screen.Figure: Sub Title
Click File Extension Properties dropdown and select Copy from Global settings.
Figure: File Extension Properties
Select Maximum Upload File Size (In Bytes).
As you select File Extension Properties in the step number 3, all the File Types configured in Global Settings are populated in the Allow File Types dropdown. Any newly added extension on Global settings is also displayed here after CR Approval.
Figure: Allow File Types
These are configured in the Global settings under Platform. For more information, refer to Attachment Properties.
Informative
All the information about the File Upload control is defined in this section.
Enter Help Text, this field also supports rich text editor by enabling the Rich Text switch control.
It provides descriptive text or instructions to assist users in understanding how to use the file upload control.Figure: Help Text in File Upload control
If you enable Rich Text, then the editor is displayed accordingly.
Figure: Rich Text Editor in Help TextEnter Watermark, this acts as placeholder for the field.
Figure: Water Mark
The configured Watermark is displayed on the Consumer Form as well.Figure: File Upload on Main Form - Consumer
Enter ToolTip, this is info message as how the user should act about the field.
Figure: ToolTip on File Upload controlThe configured Tooltip is displayed as below in the Form.
Figure: ToolTip
Validation Message
Configure properties for file upload Validation Message.
Figure: Validation Message
For more information, refer to the following Field Description:
Field | Description |
---|---|
Invalid File Type Message Detail | Enter text (error details) to be displayed when user is trying to upload an invalid File Type. |
Invalid File Size Message Detail | Enter text (error details) to be displayed when user is trying to upload a file of size greater than the defined limit. Example: If the maximum file size is defined as 350 KB, then the message can be displayed as " Maximum upload size is 350KB". |
Invalid File Limit Message Detail | Enter text (error details) to be displayed when user is trying to upload files more than the set file limit. Example: If file limit is set to 2 and user is trying to upload more than 2 files, then the message can be displayed as " Maximum number of files exceeded." |
Invalid File Type Message Summary | Enter text (error summary) to be displayed as summary when user is trying to upload an invalid File Type. |
Invalid File Size Message Summary | Enter text (error summary) to be displayed when user is trying to upload a file of size greater than the defined limit. |
Invalid File Limit Message Summary | Enter text (error summary) to be displayed when user is trying to upload files more than the set File Limit. |
Note
Include {0} if you want the user-selected file name to appear dynamically in the error message summary.
Advance
To configure Advance Properties, select Advance tab, this enables the Application Designer to allow multiple File Uploads on the Form by selecting Allow Multiple switch control.
Figure: Advance File Upload configuration
Validations
This section contains pre-built validations to save time and effort by ensuring data accuracy and completeness without the need for custom rules.
To configure Validations, perform the following steps:
Select Validations tab.
The configuration screen is displayed.Figure: Validation of File Upload
Select Tenant.
This displays additional field as when the File Upload should be enabling Application Designer to select the Validation.
Figure: Validation condition
Following are Validation options in the dropdown:
Figure: Validation OptionsField
Description
Mandatory
Select Mandatory from the dropdown list to make the control mandatory. It ensures that the field must be filled out before submitting the form.
Disabled
Select Disabled from the dropdown list to make the control a disabled control. This prevents users from interacting with a field, effectively making it read-only and preventing any changes or inputs.
Hidden
Select Hidden from the drop-down list to make the control a hidden control.
Editable
Select Editable from the dropdown list to make the control editable.
Set File Type
Select Set File Type from the dropdown list to validate based on File Type.
Set File Limit
Select Set File Limit from the dropdown to validate based on File Limit.
Less Than (File Size)
Select Less Than (File Size) from the dropdown to validate less than the file size.
More Than (File Size)
Select More Than (File Size) from the dropdown to validate more than the file size.
Upon selecting one of the above option, following screen is displayed:
By default, Every Time is selected.
Figure: Validate
Every Time: Select Every time if you want to display this control always without any specific conditions.
Below Conditions Meet: Select this option if you want the validations on the control to be triggered based on a specific condition(s).Figure: Below Condition Meet Validation for File Upload
Configure the conditions using Field Operator and Value:Field: Choose the field from the drop-down list to which the condition applies.
Value: Define the value for the chosen field, determining when the condition should be triggered. Enter the value in a text box for non-referenced fields like short and long text. For referenced fields such as single choice and tree control, select the value from the respective field type.
Operator: Select the appropriate operator from the drop-down list, which varies based on the selected field type.
Click icon to add more conditions.Click icon to delete conditions.
Appearance
Customize controls appearance by aligning brand colors through appearance properties, enhancing user experience, and reinforcing brand identity.
Figure: Appearance
To know more about the fields that are available under the Appearance section, see the Field Description given below.
Field | Description |
---|---|
Font Type | Select the desired font from the drop-down menu to customize the control. |
Font Color | Select a font color from the color palette to enhance the visibility and aesthetics of the control. |
Font Size | Select the desired font size to your preference for better readability and presentation for the control. |
Font Style | Select either Bold, underlined, or Italic font style to emphasize specific text within the control. |
Security
The Security tab ensures data security and privacy by applying restricted access or encryption to sensitive field data, ensuring that only users with authorized roles can access or modify it.
Figure: Security
Select Encrypted.
Enable this option to ensure sensitive information remains secure and confidential by making it unreadable without the appropriate decryption key.
Example: In a document management system for sensitive contracts and agreements, uploaded files containing confidential information, such as partnership agreements or non-disclosure agreements, can be encrypted. Only authorized individuals with decryption keys, typically legal advisors or designated executives, are granted access to view or modify these documents.
For more details about Security, see Form Security.
Click Save to save the configurations.
Configurations get saved, the window closes, and the control moves back to the design canvas.
Click Cancel if you want to discard the configuration.