This demo application shows how to use Image Uploader with the ShellComboBox class to build user interface similar to the Open File dialog.
Features
The application highlights the following features:
- Use of the auxiliary ShellComboBox control.
- Appearance customization, including custom HTML buttons.
- Folder upload.
- File filtering by extension.
- Automatic connection recovery.
![]() |
---|
To find information about how this demo is implemented using a specific platform, see the Samples by Platforms topic. Folder upload is not yet supported in the Java version of Image Uploader. |
Client-Side Code
ShellComboBox Control
The ShellComboBox class allows adding a dropdown menu with the folder tree, similar to the one in the Address Bar of Windows Explorer. You add this menu to the page using the ShellComboBoxWriter and bind it to the Image Uploader object using the AdditionalFolderNavigator property. Having this additional control, there is no need to display the tree pane, which duplicates the navigation functionality, so this pane is hidden using the TreePaneWidth property.
Appearance Customization
Figure 1. Application appearance of the ActiveX version.
Figure 2. Application appearance of the Java version.
All buttons seen in the user interface of this sample are custom. In order to replace standard buttons with custom HTML versions, the standard ones are hidden using the ShowButtons property. Then, appropriate Image Uploader methods are bound to the new buttons via their onclick handlers. For more details, see the Customizing Buttons topic.
Folder Upload
In the ActiveX version of Image Uploader, the user can also mark whole folders for upload. To display folders in the folder content pane, set the ShowSubfolders property to true. To allow folder uploading, use the AllowFolderUpload property.
File Filtering
This application also demonstrates how to allow users to upload images only of certain types. Files of other types simply will not be shown while browsing. Extensions of the allowed files are listed as a value of the FileMask property. For more information, see the Restricting Files by Extensions and Types topic.
Automatic connection recovery
Conditions for automatic connection recovery are specified using the AutoRecoverTimeOut and AutoRecoverMaxTriesCount properties. For more details about connection recovery, see the Configuring Automatic Upload Recovery topic.
Server-Side Code
To complete the upload started by Image Uploader, some actions on the server side should be performed. The upload script of this application is almost equivalent to the one of the Basic Demo Sample. The only difference is that now images are sent in several batches, and, therefore, only POST fields with index 1 (such as SourceFile_1, FileName_1, etc.) are used.
See Also
Samples
Samples by Platforms
Basic Demo Sample
Reference
ShellComboBox Class
AdditionalFolderNavigator Property
AdditionalFolderNavigator Property
TreePaneWidth Property
CanGoToFolder Method
GoToFolder Method
ShowButtons Property
ShowSubfolders Property
AllowFolderUpload Property
FileMask Property
FilesPerOnePackageCount Property
AutoRecoverTimeOut Property
AutoRecoverMaxTriesCount Property
Manual
Customizing Buttons
Restricting Files by Extensions and Types
Configuring Automatic Upload Recovery