logo

How To: Upload Files To Domino From Flex

If you're working with Domino and Flex, sooner or later you're going to want to upload a file to the server. But, how?

Well, it's not simple (that is, it's nothing much like the way you're used to doing things) but it's not particularly hard either. Although you do have to do it all using script, rather than just plonking a file upload control on a form and letting the browser handle the rest.

In Flex you upload (and download for that matter) files using the FileReference class, which you create like this:

private var fileRef:FileReference = new FileReference();

The FileReference object has, amongst others, the following two methods: browse and upload, which let you browse for files and upload a file, respectively.

Unlike browsing for files using the HTML control, with Flex we can specify what type of files to upload, using a FileFilter, like so:

var fileFilter:FileFilter = new FileFilter("CSV Files", "*.csv");

Once we have a filter (or more than one if you like) we can browse for those file types like so:

fileRef.browse( [ fileFilter ] );

At which point the user would see a standard file browsing dialog for their OS.

Client-Side Validation

When the "file selected" event fires we can then do client-side testing of the file size.

if (fileRef.size > 10240) {
 Alert.show("That file is too big! Must be less than 10kb");
}

Try doing that in a browser!

Doing the Upload

Here comes the clever part. To POST the file to the server we use the upload method of the FileReference object. Like so:

var request:URLRequest = new URLRequest(
  basePath+"Demos.Flex.Upload?CreateDocument"
 );
fileRef.upload(request, "%%File.1");

Notice the second parameter passed to the upload method! Look familiar?

What this does is tell the server what "field name" to expect the file to be POSTed to. In our case we're using "%%File.1" which is a special name you need to use if you want to add your own file upload controls to forms. Note that for this to work you need to make a change to the server's Notes.ini file, as described in the last link.

A Simple Demo

Here's a simple demo of a Flex app which actually uploads files to this Domino server.

Once uploaded you should see a "open document" link appear at the bottom which will let you open the actual document in the browser, to prove the file is there. Have a play.

Source Code?

If you want to see all the code involved (there's not that much) then just right-click the Flex app above and choose "view source".

Comments

    • avatar
    • Jake Howlett
    • Wed 19 Aug 2009 05:57 AM

    NOTE: If you want to view the source you'll need to remove the "store.nsf/" from the URL that pops-up (enabling view source on Flex is a pain!). Or you can just open the plan text file here.

  1. Great Info - thats going to come in handy.

    Thanks Jake.

    • avatar
    • Palmi
    • Wed 19 Aug 2009 06:19 AM

    Great Stuff , didnĀ“t you do a import one too ? where you would import into domino DB from CSV or Excel ?

    Thanks Jake for your hard work

  2. Thank you Jake - an excellent example ! (and very useful)

    • avatar
    • Jake Howlett
    • Wed 19 Aug 2009 06:41 AM

    Palmi - yes. Where did you see that though, didn't know I'd posted it?

    To import all you need to do is have the WQS agent of the document created read the uploaded file. I have the code for this in the Flex Accounts database, which I plan on releasing as soon as I've tidied it up....

  3. Don't you write "How To: Download Files To Domino From Flex" ? Please, ...

    http://codestore.net/store.nsf/cmnts/56AF1CEE8B8917EA86257554006DAEBF?OpenDocument

    • avatar
    • Jake Howlett
    • Wed 19 Aug 2009 11:22 AM

    I don't get what you mean Satourne. Are you asking me to write about how you'd download a file Domino from Flex? Or are you asking if what I've written about here should have a different title? Answers are maybe and no.

  4. Thanks Jake. Are your flex efforts still to just play with it/learn something new or have you gotten any projects where you are using it?

    • avatar
    • Jake Howlett
    • Wed 19 Aug 2009 11:42 AM

    Hi Niall. I don't have to time play/learn unless there's a project to finance it. So far I've done 3 or 4 Flex project, based on Domino, and customers are loving it.

    • avatar
    • Palmi
    • Wed 19 Aug 2009 12:25 PM

    Jake , I thought i saw that on your site but i may have seen some sort of refrence to it in one of the FLEX project . really like to see that Agent. any change of you publising it ?

  5. Jake, thanks for talking about Flex. Really helpful. Have you seen anyone doing uploading of full folders using Flex? Even if not a Domino backend?

    • avatar
    • Jake Howlett
    • Wed 19 Aug 2009 02:33 PM

    Palmi. The code will be part of the accounts Flex db. Coming soon.

    Jim. Not sure about whether you can select a folder and upload all contents. Although there is a FileReferenceList class which lets you select multiple files in the browse dialog, so you could always open the folder and press Ctrl-A to upload them all?

    • avatar
    • Chris
    • Wed 19 Aug 2009 02:43 PM

    Any change of getting this to work with multiple file uploading using Domino in the future? Here is an example of using FLEX to upload more than one file at once: http://www.kerkness.ca/flexexamples/uploader/UploadExample.html

    • avatar
    • Jake Howlett
    • Wed 19 Aug 2009 02:56 PM

    Chris. It looks like all that example does it repeatedly do what my example does and perform a POST for each file.

    When you say working with Domino, do you mean getting all files in the same document? Could be done. When the first file is uploaded it would return the new docid. The URLRequest would then be made to point to DOCID?SaveDocument rather than FORMNAME?CreateDocument. Make sense?

    • avatar
    • lamon
    • Thu 20 Aug 2009 02:46 AM

    jake,can I write the local filename with js? so I can do something automatic.

    Now I just click "choose file" button to upload local file

    • avatar
    • Jake Howlett
    • Thu 20 Aug 2009 03:13 AM

    lamon, I would be very, very surprised if you could. For the same reasons JavaScript in the browser won't let you I can't imagine Flex will.

    • avatar
    • Jake Howlett
    • Thu 20 Aug 2009 03:20 AM

    Just to confirm - the name property of the FileReference is read only. In fact the manual says: "All the properties of a FileReference object are populated by calling the browse() method"

    • avatar
    • Alex
    • Mon 24 Aug 2009 09:24 AM

    Hi Jake, how difficult to add some validation control to prevent the same file (i.e. filename) to be uploaded twice?

    • avatar
    • Jake Howlett
    • Mon 24 Aug 2009 10:42 AM

    Depends what you mean by easy Alex. Depends how much Flex you know. It is fairly easy though.

    • avatar
    • Watcha
    • Mon 7 Feb 2011 10:59 PM

    hello I can see source code , When I right-click on your demo Flex.

Your Comments

Name:
E-mail:
(optional)
Website:
(optional)
Comment:


About This Page

Written by Jake Howlett on Wed 19 Aug 2009

Share This Page

# ( ) '

Comments

The most recent comments added:

Skip to the comments or add your own.

You can subscribe to an individual RSS feed of comments on this entry.

Let's Get Social


About This Website

CodeStore is all about web development. Concentrating on Lotus Domino, ASP.NET, Flex, SharePoint and all things internet.

Your host is Jake Howlett who runs his own web development company called Rockall Design and is always on the lookout for new and interesting work to do.

You can find me on Twitter and on Linked In.

Read more about this site »

More Content