File Widget

Last published at: October 26th, 2022

Description:

File widget lets renders a file attachment control for selecting and uploading file attachments.

Inputs

  • ID/Name - Name of widget generated by FlowWright (read-only field)
  • Extensions - Enter file extensions as per the reference
  • Allow Multiple Files - Select checkbox to upload multiple files (tick mark) 
  • Max File Size in MB - Enter max file size to restrict the uploaded attachment  
  • Hide - Select checkbox to Hide (tick mark)
  • Read Only - Select checkbox to Read-Only (tick mark)
  • Show Uploaded File -  Select checkbox to display files uploaded (tick mark)
  • Tool Tip - Enter information to display on mouse hover on form render
  • Styles - Enter the CSS scripts for widget styles
  • Apply Classes - Select between custom classes defined 
  • Save - Save the input values 
  • Delete - Remove this form widget from the designer page 
  • Close - Close the input popup window

Design:

Example: 

Let’s build and execute the FileWidgetDef example.  

  • Create a new form definition called “FileWidgetDef
  • Select the Open Designer checkbox and click the “Create” button
  • Drag a File widget to the canvas
  • Double-click on the widget to configure the Settings inputs as shown in the below graphic
  • The file upload can be restricted to a specific file type by its extension and size (MB)
  • The file can be configured as REQUIRED during runtime
  • The files may be downloaded when form is rendered and also when the FILE widget is configured as ReadOnly. 

  • Configure the Styling and Other inputs as shown in the below graphic
  • Click on Save button and Close the popup window
  • Create a new form instance and edit the form. Upload the file attachments. The rendered widget will look as shown in the below graphic

  • Upload a file attachment exceeding 1 MB in file size (the file may be single or multiple). The rendered widget will look as shown in the below graphic