Avg. Rating 5.0

Problem

I'm trying to build a form on an admin page of a website that will allow me to upload files to a folder on the server, while at the same time uploading information about the file (which is gathered in the form) into a MySQL database. So far I've been able to create a form that will do one or the other, but not both. Now I'm stuck and could use some help. Thanks.

Solution

You can add URLVariables to the URLRequest using the data property. Then send everything over using the FileReference class using the upload method. Inside your your URLRequest you can use the URLRequestMethod to decide if you want to use POST or GET.

Detailed explanation

Actionscript is doing all the work. This just happens to be done with Flex 4
Your server side script should pick up everthing in POST.

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
               creationComplete="init()">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
            import flash.events.ProgressEvent;
            import flash.net.*;
            import flash.net.FileFilter;
            import flash.net.FileReference;
            import flash.net.FileReferenceList;
            import flash.net.URLRequestMethod;
            import flash.net.URLVariables;
           
            private var _fileReferenceObj:FileReference;
            private function init():void
            {
                uploadButton.addEventListener(MouseEvent.CLICK, selectFile);
            }
           
            private function selectFile(evt:MouseEvent):void
            {
                _fileReferenceObj = new FileReference();
                _fileReferenceObj.addEventListener(Event.SELECT, sendSelectedFile);
                _fileReferenceObj.addEventListener(ProgressEvent.PROGRESS, progressHandler);
                _fileReferenceObj.addEventListener(IOErrorEvent.IO_ERROR, ioErrorHandler);
                _fileReferenceObj.addEventListener(Event.COMPLETE, completeHandler);               
                _fileReferenceObj.browse();
            }
           
            private function progressHandler(event:ProgressEvent):void {
                var file:FileReference = FileReference(event.target);
                trace("progressHandler: name=" + file.name + " bytesLoaded=" + event.bytesLoaded + " bytesTotal=" + event.bytesTotal);
            }           
           
            private function sendSelectedFile(evt:Event):void
            {
                trace(evt.target.name);
                var _urlVars:URLVariables = new URLVariables();
                    _urlVars.name = "Your Name";
                    _urlVars.location = "Your Location";
                   
                var _urlReq:URLRequest = new URLRequest("http://www.yourURL.com/upload.php");
                    _urlReq.method = URLRequestMethod.POST;
                    _urlReq.data = _urlVars;
                _fileReferenceObj.upload(_urlReq);
                trace("_urlReq.url  = " + _urlReq.url);
                trace("_urlReq.data  = " + _urlReq.data);
            }
            private function ioErrorHandler(event:IOErrorEvent):void {
                trace("ioErrorHandler: " + event);
            }
           
            private function completeHandler(event:Event):void {
                trace("completeHandler: " + event);
            }           
        ]]>
    </fx:Script>
    <s:Button id="uploadButton" label="Select A file" />
</s:Application>
 


+
This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License. Permissions beyond the scope of this license, pertaining to the examples of code included within this work are available at Adobe.

Report abuse

Related recipes