Archive for August 7, 2013

File Upload for WebClient

Follow the attached steps to implement a file upload from your browser to the web server.

1)    Import the attached (“FileUploadServlet”) Java Project into your Eclipse Workspace.File Upload

2)    Right click your Java Project, and select Properties. Under “Java Build Path”, add reference in the Projects tab to the “FileUploadServlet” project. And in the Libraries tab, add a reference to the “commons-io-2.1.jar”, which is in the “FileUploadServlet” project.

3)    Right click your Web Project, and select Properties. Under “Java Build Path”, add reference in the Projects tab to the “FileUploadServlet” project.

4)    Right click your Web Project, select New, then Servlet. Add the existing UploadServlet to your web project. This will update the web.xml with your new servlet.


5)    In your file, add the following setting. The value should be /”Your Web Project”/upload. If you want to change the url-pattern for your upload servlet in the web.xml file, the “/upload” part of this setting will need to change to whatever you set your url-pattern to:

        # Upload Servlet Location



6)    In Plex, create an upload pattern function called “~WebUploadShell”. This should inherit from “~WebShell” and “~DetailPopup”.


7)    In “~WebUploadShell”, add a field to the panel called “UploadFileName”, in a region called “UploadP”. This field will inherit from “FIELDS/FileName” and have two values added to it which are shown below.


8)     In the panel editor for “~WebUploadShell”, hide the label for “UploadFileName”, and add the following control name to the edit for “UploadFileName”:



9)    In the panel editor for “~WebUploadShell”, create an event called “UploadComplete” and attach it to the “Updated” physical event for the “UploadFileName” edit control.


10)    In the action diagram for “~WebUploadShell”, add the following code:


11)    Now that the patterns are created, have whatever function you want to have upload capability inherit from “~WebUploadShell”.


12)    In the “Edit Point Set Upload Folder”, you will need to set where you want the file to upload to UploadP<UploadFileName> and do a Put UploadP. If you need to perform code when the upload completes, please put this code in the UploadComplete event. When running, the UploadFileName field will appear as an upload button. When clicked, it will take you to a file selection window, when selected, the file will begin uploading.


NOTE: The placement of the UploadFileName field in the panel is based on a different html form than that of regular WebClient. It positions relative to the top of the panel, not relative to other objects. So, it will take some experimentation to get the placement exactly how you want it.

© 2013 CM First Group - All rights reserved