This document provides an overview of uploading files in Flex using the FileReference class. It discusses the basic steps, which are to display a dialog box for the user to select a file, upload the file to the server, process it on the server, and return any necessary data. It then describes the FileReference class and its properties and methods for browsing, selecting, uploading, and canceling a file upload. Events that can be used during the upload process are also covered, along with the FileFilter class for restricting file types.

1. Uploading Files in Flex
Kevin Schmidt
Other Side Productions, LLC
kevin.schmidt@othersidellc.com

2. Who am I?
- Adobe Community Expert
- Adobe Certified Instructor
- Indianapolis Flex User Group Manager
- Speaker at Adobe MAX
- Blog – flexinabox.com
- Founder – Other Side Productions, LLC
- Flex Consulting
- LiveCycle Consulting
- ColdFusion Consulting

3. The Basics
1. Form
- text field
- browse button
- upload button
2. Display a dialog box to allow the user to browse their
local file system for a file to upload.
3. Upload the file to the server.
4. Process the file upload on the server.
5. Return any data necessary

4. FileReference Class
- The FileReference class provides a means to upload and
download files between a user's computer and a server. An
operating-system dialog box prompts the user to select a file to
upload or a location for download.
- IT DOES NOT
- Allow you to read from or write to the transferred file – no
access to the file at all
-Allow for authentication

5. Using The FileReference Class
- Create a FileReference Object:
var fileReference:FileReference = new FileReference();
-Notes
- References one file
- Populated with information about the file
- Properties
- name – The name of the file on the local system
- size – The size, in bytes
- type – The file type
- creationDate – Date file created on local system
- creator ( MAC Only ) - null on all other systems
- modificationDate – Date file last modified on local
system

6. FileReference.browse() Method
- Opens the operating system dialog box to allow user to select a
file.
- User allowed to select a single file
- Populates the properties of the FileReference object
- Resets the properties each time the method is called
- Usually invoked in response to a click event
- Default location displayed in the dialog box is the most recently
browsed location – default is the desktop if unknown location

7. FileReference.upload() Method
-Uploads the file in the FileReference object
-Requires two arguments
- request – URLRequest object that points to
the server side code to process the upload.
- uploadDataFieldName – variable name used
in the server side code. Default: Filedata
- URLRequest
var urlRequest = new URLRequest(“http://www.url.com/fileUpload.ext” )

8. FileReference.cancel() Method
- Cancels the upload of the file currently uploading

9. Events
- SELECT:Event – Dispatched when the user selects a file from the
dialog box
- PROGRESS:ProgressEvent - Dispatched when progress data is
available
- event.bytesLoaded – total loaded
- event.bytesTotal – total to load
- COMPLETE:Event – Dispatched when the file has completely
uploaded.
- UPLOAD_COMPLETE_DATA:DataEvent – Dispatched when the server
responds with data.
- IO_ERROR:IOErrorEvent – Dispatched when an error occurs during
the upload

10. FileFilter Class
Allows you to restrict the file extensions that users
can select
Supply to the FileReference.browse() method.
var fileFilter:FileFilter = new FileFilter( “Images”, “*.jpeg;*.jpg”);
fileReference.browse( [fileFilter] );

11. Example

12. Questions – Comments - Insults
Email:
kevin.schmidt@sporkconsulting.com
Slides and Sample Code at:
http://www.flexinabox.com