FileUpload

The FileUpload widget provides the ability to select and upload files to the server-side. It is a composite widget, which means that it consists of a collection of widgets.

Implementation base

The FileUpload widget is a Dojo-based widget. The following widgets are combined to form the FileUpload widget:
  • com.ibm.btt.dojox.form.FileUploader
  • com.ibm.btt.dijit.form.TextBox
  • com.ibm.btt.dijit.form.Button

Properties

The following properties can be configured for the FileUpload widget.
Table 1. Properties that can be configured for the FileUpload widget.
Property Description
id The id is the identifier for the widget.
dataName The dataName property is the name of the data element to which the widget is bound. This property is mandatory.
fileExtension The fileExtension property specifies the file name extensions that can be submitted by the FileUpload widget to the server-side.
isMandatory The isMandatory property specifies whether a user is required to select and upload files to the server-side by using the FileUpload widget.
visibility The visibility property defines how a widget is displayed on a GUI. The following values can be specified for this property:
visible
The widget is displayed on a GUI and users are able to interact with the widget.
hidden
The widget is not displayed on a GUI, but it occupies space on the GUI.
gone
The widget is not displayed on a GUI, and it does not occupy space on the GUI.
disabled Disabled elements cannot have focus, do not receive or fire mouse events, cannot receive user input. If you select a value of true for the disabled property, the widget is displayed on a GUI but a user cannot interact with it. Data contained in a disabled widget is not processed when the form is submitted. The default value for the disabled property is false.
hint The hint is a description of the widget that is displayed as a tooltip for a user. The hint property has multilingual support.
styleClass The styleClass property specifies the name of the CSS style ( also known as CSS style class) associated with the widget. This property is set by selecting a style from the CSS styles table in the Style tab of the Properties view. If you do not configure the styleClass property, the default style is used instead. For more detailed information, refer to Setting CSS style to widgets
width The width property specifies the width of the widget. This property is set in the Appearance tab of the Properties view.

Data mapping

In a WebSphere® Multichannel Bank Transformation Toolkit context on the server-side, the mapped data of the FileUpload widget is defined in a special format. The following code block is a sample definition of mapped data for the FileUpload widget:
<KColl id="file">
	<field id="name" />
	<field id="size" />
	<field id="fileId"/>
</KColl>

<KColl id="fileupload" />
	<refData refId="file" />
	<IColl id="receivedFiels">
		<refData refId="file"  />
	</IColl>
	<field id="handler" />
</KColl>

For more detailed information about data mapping, you can see: Binding data to a fileUpload widget

ECA editor support

The following events and properties can be configured for the FileUpload widget with the ECA editor.
Note: The ECA editor does not support the configuration of events for the FileUpload widget.
Table 2. Events that can be added to the FileUpload widget by using the ECA editor.
Event Description
onUpload Is fired when a file is uploaded.
onComplete Is fired when a file has uploaded successfully.
onError Is fired when an error occurs while a file is being uploaded.
onDelete Is fired when a user removes a file that is uploaded and uploads another file.
onCancel Is fired when the file upload process is cancelled.
Table 3. Properties that can be configured for the FileUpload widget by using the ECA editor.
Property Description
visibility This property defines how a widget is displayed on a GUI. The following values can be specified for this property:
visible
The widget is displayed on a GUI and users are able to interact with the widget.
hidden
The widget is not displayed on a GUI, but it occupies space on the GUI.
gone
The widget is not displayed on a GUI, and it does not occupy space on the GUI.
Note: This property can be used in the Condition and Actions part of ECA rule.
disabled The disabled property is an expert-level property, which means that it is available for use in the XUI editor only if the XUI editor is configured to display expert properties. If you select a value of true for the disabled property, the widget is displayed on a GUI but a user cannot interact with it. Data contained in a disabled widget is not taken into account during form submission. The default value for the disabled property is false.
Note: This property can be used in the Condition and Actions part of ECA rule.
styleClass The styleClass property specifies the name of the CSS style ( also known as CSS style class) associated with the widget. This property is set by selecting a style from the CSS styles table in the Style tab of the Properties view. If you do not configure the styleClass property, the default style is used instead. For more detailed information, refer to Setting CSS style to widgets
Note: This property can be used in the Actions part of ECA rule.
hint The hint is a description of the widget that is displayed as a tooltip for a user. The hint property has multilingual support.
Note: This property can be used in the Actions part of ECA rule.