I have been working with the examples for how to upload a file to the server. Though i got the example to work. there is one more thing i need to do. i need to allow the user to be able to select multiple files.?In the example when you click on Upload, it opens a MS window to allow you to select a file. This example does not allow you to select more then one file though. I found another example for selecting multiple files but this one differs very much in that the person who make it ''Ryan Favro'' created a whole new GUI window to select multiple files. those his example works great, i dont want a special window to select files, i want the MS window to do it.
Is there a way to make the original example that uses the MS window to allow the user to select multiple files ?
I have attached the example that uses the MS window.
Help with Upload file to Server Examples
Hi,
You can use fileReferenceList class to upload multiple files to the server.
Help with Upload file to Server ExamplesHi,
Use this code. May be it helps u.
fileuploadapp.mxml
%26lt;?xml version=''1.0'' encoding=''utf-8''?%26gt;
%26lt;mx:Application xmlns:mx=''http://www.adobe.com/2006/mxml'' xmlns:com=''test.*'' layout=''absolute''
?creationComplete=''initApp()'' viewSourceURL=''srcview/index.html''%26gt;
?
?%26lt;mx:Script%26gt;
?%26lt;![CDATA[
?
?import mx.controls.Alert;
?
?private const _strDomain:String = new String(''http://localhost:8400/'');
?private const _strUploadScript:String = new String(_strDomain + ''ProcessFileUp/UploadFile'');
?
?// Initalize
?private function initApp():void {
?Security.allowDomain(_strDomain);
?}
?
?]]%26gt;
?%26lt;/mx:Script%26gt;
?
?%26lt;mx:Canvas width=''400'' height=''300'' horizontalCenter=''0'' verticalCenter=''0''%26gt;
?%26lt;com:FileUpload
?width=''100%'' height=''100%''
?uploadUrl=''{_strUploadScript}''
?uploadComplete=''Alert.show('File(s) have been uploaded.', 'Upload successful')''
?uploadIOError=''Alert.show('IO Error in uploading file.', 'Error')''
?uploadSecurityError=''Alert.show('Security Error in uploading file.', 'Error')''/%26gt;
?%26lt;/mx:Canvas%26gt;
%26lt;/mx:Application%26gt;
fileuoload.mxml
%26lt;?xml version=''1.0'' encoding=''utf-8''?%26gt;
%26lt;mx:Panel xmlns:mx=''http://www.adobe.com/2006/mxml'' xmlns:com=''*''
?layout=''vertical'' width=''100%'' minWidth=''400'' height=''100%'' minHeight=''200''
?title=''Upload Files'' creationComplete=''initCom()''%26gt;
?
?%26lt;mx:Metadata%26gt;
?[Event(name=''uploadComplete'', type=''flash.events.Event'')]
?[Event(name=''uploadProgress'', type=''flash.events.ProgressEvent'')]
?[Event(name=''uploadCancel'', type=''flash.events.Event'')]
?[Event(name=''uploadIOError'', type=''flash.events.IOErrorEvent'')]
?[Event(name=''uploadSecurityError'', type=''flash.events.SecurityErrorEvent'')]
?%26lt;/mx:Metadata%26gt;
?%26lt;mx:Script%26gt;
?%26lt;![CDATA[
?
?
?import mx.controls.*;
?import mx.managers.*;
?import mx.events.*;
?import flash.events.*;
?import flash.net.*;
?
?private var _strUploadUrl:String;
?private var _refAddFiles:FileReferenceList;?
?private var _refUploadFile:FileReference;
?private var _arrUploadFiles:Array;
?private var _numCurrentUpload:Number = 0;?
?
?// Set uploadUrl
?public function set uploadUrl(strUploadUrl:String):void {
?_strUploadUrl = strUploadUrl;
?}
?
?// Initalize
?private function initCom():void {
?_arrUploadFiles = new Array();?
?enableUI();
?uploadCheck();
?}
?
?// Called to add file(s) for upload
?private function addFiles():void {
?_refAddFiles = new FileReferenceList();
?_refAddFiles.addEventListener(Event.SELECT, onSelectFile);
?_refAddFiles.browse();
?}
?
?// Called when a file is selected
?private function onSelectFile(event:Event):void {
?var arrFoundList:Array = new Array();
?// Get list of files from fileList, make list of files already on upload list
?for (var i:Number = 0; i %26lt; _arrUploadFiles.length; i++) {
?for (var j:Number = 0; j %26lt; _refAddFiles.fileList.length; j++) {
?if (_arrUploadFiles[i].name == _refAddFiles.fileList[j].name) {
?arrFoundList.push(_refAddFiles.fileList[j].name);
?_refAddFiles.fileList.splice(j, 1);
?j--;
?}
?}
?}
?if (_refAddFiles.fileList.length %26gt;= 1) {?
?for (var k:Number = 0; k %26lt; _refAddFiles.fileList.length; k++) {
?_arrUploadFiles.push({
?name:_refAddFiles.fileList[k].name,
?size:formatFileSize(_refAddFiles.fileList[k].size),
?file:_refAddFiles.fileList[k]});
?}
?listFiles.dataProvider = _arrUploadFiles;
?listFiles.selectedIndex = _arrUploadFiles.length - 1;
?}?
?if (arrFoundList.length %26gt;= 1) {
?Alert.show(''The file(s): \n\n閳?'' + arrFoundList.join(''\n閳?'') + ''\n\n...are already on the upload list. Please change the filename(s) or pick a different file.'', ''File(s) already on list'');
?}
?updateProgBar();
?scrollFiles();
?uploadCheck();
?}
?
?// Called to format number to file size
?private function formatFileSize(numSize:Number):String {
?var strReturn:String;
?numSize = Number(numSize / 1000);
?strReturn = String(numSize.toFixed(1) + '' KB'');
?if (numSize %26gt; 1000) {
?numSize = numSize / 1000;
?strReturn = String(numSize.toFixed(1) + '' MB'');
?if (numSize %26gt; 1000) {
?numSize = numSize / 1000;
?strReturn = String(numSize.toFixed(1) + '' GB'');
?}
?}?
?return strReturn;
?}
?
?// Called to remove selected file(s) for upload
?private function removeFiles():void {
?var arrSelected:Array = listFiles.selectedIndices;
?if (arrSelected.length %26gt;= 1) {
?for (var i:Number = 0; i %26lt; arrSelected.length; i++) {
?_arrUploadFiles[Number(arrSelected[i])] = null;
?}
?for (var j:Number = 0; j %26lt; _arrUploadFiles.length; j++) {
?if (_arrUploadFiles[j] == null) {
?_arrUploadFiles.splice(j, 1);
?j--;
?}
?}
?listFiles.dataProvider = _arrUploadFiles;
?listFiles.selectedIndex = 0;?
?}
?updateProgBar();
?scrollFiles();
?uploadCheck();
?}
?
?// Called to check if there is at least one file to upload
?private function uploadCheck():void {
?if (_arrUploadFiles.length == 0) {
?btnUpload.enabled = false;
?listFiles.verticalScrollPolicy = ''off'';
?} else {
?btnUpload.enabled = true;
?listFiles.verticalScrollPolicy = ''on'';
?}
?}
?
?// Disable UI control
?private function disableUI():void {
?btnAdd.enabled = false;
?btnRemove.enabled = false;
?btnUpload.enabled = false;
?btnCancel.enabled = true;
?listFiles.enabled = false;
?listFiles.verticalScrollPolicy = ''off'';
?}
?
?// Enable UI control
?private function enableUI():void {
?btnAdd.enabled = true;
?btnRemove.enabled = true;
?btnUpload.enabled = true;
?btnCancel.enabled = false;
?listFiles.enabled = true;
?listFiles.verticalScrollPolicy = ''on'';
?}
?
?// Scroll listFiles to selected row
?private function scrollFiles():void {
?listFiles.verticalScrollPosition = listFiles.selectedIndex;
?listFiles.validateNow();
?}
?
?// Called to upload file based on current upload number
?private function startUpload():void {
?if (_arrUploadFiles.length %26gt; 0) {
?disableUI();
?
?listFiles.selectedIndex = _numCurrentUpload;
?scrollFiles();
?
?// Variables to send along with upload
?var sendVars:URLVariables = new URLVariables();
?sendVars.action = ''upload'';
?
?var request:URLRequest = new URLRequest();
?request.data = sendVars;
?request.url = _strUploadUrl;
?request.method = URLRequestMethod.POST;
?_refUploadFile = new FileReference();
?_refUploadFile = listFiles.selectedItem.file;
?_refUploadFile.addEventListener(ProgressEvent.PROGRESS, onUploadProgress);
_refUploadFile.addEventListener(Event.COMPLETE, onUploadComplete);
?_refUploadFile.addEventListener(IOErrorEvent.IO_ERROR, onUploadIoError);
?_refUploadFile.addEventListener(SecurityErrorEvent.SECURITY_ERROR, onUploadSecurityError);
?_refUploadFile.upload(request, ''file'', false);
?}
?}
?
?// Cancel and clear eventlisteners on last upload
?private function clearUpload():void {
?_refUploadFile.removeEventListener(ProgressEvent.PROGRESS, onUploadProgress);
?_refUploadFile.removeEventListener(Event.COMPLETE, onUploadComplete);
?_refUploadFile.removeEventListener(IOErrorEvent.IO_ERROR, onUploadIoError);
?_refUploadFile.removeEventListener(SecurityErrorEvent.SECURITY_ERROR, onUploadSecurityError);
?_refUploadFile.cancel();
?_numCurrentUpload = 0;
?updateProgBar();
?enableUI();
?}
?
?// Called on upload cancel
?private function onUploadCanceled():void {
?clearUpload();
?dispatchEvent(new Event(''uploadCancel''));
?}
?
?// Get upload progress
?private function onUploadProgress(event:ProgressEvent):void {
?var numPerc:Number = Math.round((event.bytesLoaded / event.bytesTotal) * 100);
?updateProgBar(numPerc);
?var evt:ProgressEvent = new ProgressEvent(''uploadProgress'', false, false, event.bytesLoaded, event.bytesTotal);
?dispatchEvent(evt);
?}
?
?// Update progBar
?private function updateProgBar(numPerc:Number = 0):void {
?var strLabel:String = (_numCurrentUpload + 1) + ''/'' + _arrUploadFiles.length;
?strLabel = (_numCurrentUpload + 1 %26lt;= _arrUploadFiles.length %26amp;%26amp; numPerc %26gt; 0 %26amp;%26amp; numPerc %26lt; 100) ? numPerc + ''% - '' + strLabel : strLabel;
?strLabel = (_numCurrentUpload + 1 == _arrUploadFiles.length %26amp;%26amp; numPerc == 100) ? ''Upload Complete - '' + strLabel : strLabel;
?strLabel = (_arrUploadFiles.length == 0) ? '''' : strLabel;
?progBar.label = strLabel;
?progBar.setProgress(numPerc, 100);
?progBar.validateNow();
?}
?
?// Called on upload complete
?private function onUploadComplete(event:Event):void {
?_numCurrentUpload++;?
?if (_numCurrentUpload %26lt; _arrUploadFiles.length) {
?startUpload();
?} else {
?enableUI();
?clearUpload();
?dispatchEvent(new Event(''uploadComplete''));
?}
?}
?
?// Called on upload io error
?private function onUploadIoError(event:IOErrorEvent):void {
?clearUpload();
?var evt:IOErrorEvent = new IOErrorEvent(''uploadIoError'', false, false, event.text);
?dispatchEvent(evt);
?}
?
?// Called on upload security error
?private function onUploadSecurityError(event:SecurityErrorEvent):void {
?clearUpload();
?var evt:SecurityErrorEvent = new SecurityErrorEvent(''uploadSecurityError'', false, false, event.text);
?dispatchEvent(evt);
?}
?
?// Change view state
?private function changeView():void {
?currentState = (currentState == ''mini'') ? '''' : ''mini'';
?}
?
?]]%26gt;
?%26lt;/mx:Script%26gt;
?
?%26lt;mx:states%26gt;
?%26lt;mx:State name=''mini''%26gt;
?%26lt;mx:SetProperty name=''height'' value=''60''/%26gt;
?%26lt;mx:SetProperty name=''minHeight'' value=''60''/%26gt;
?%26lt;mx:SetStyle target=''{btnView}'' name=''icon'' value=''@Embed('assets/application_put.png')''/%26gt;
?%26lt;/mx:State%26gt;
?%26lt;/mx:states%26gt;
?
?%26lt;mx:transitions%26gt;
?%26lt;mx:Transition fromState=''*'' toState=''*''%26gt;
?%26lt;mx:Resize target=''{this}'' duration=''1000''/%26gt;
?%26lt;/mx:Transition%26gt;
?%26lt;/mx:transitions%26gt;
?
?%26lt;mx:Canvas width=''100%'' height=''100%''%26gt;
?%26lt;mx:DataGrid id=''listFiles'' left=''0'' top=''0'' bottom=''0'' right=''0''
?allowMultipleSelection=''true'' verticalScrollPolicy=''on''
?draggableColumns=''false'' resizableColumns=''false'' sortableColumns=''false''%26gt;
?%26lt;mx:columns%26gt;
?%26lt;mx:DataGridColumn headerText=''File'' dataField=''name'' wordWrap=''true''/%26gt;
?%26lt;mx:DataGridColumn headerText=''Size'' dataField=''size'' width=''75'' textAlign=''right''/%26gt;
?%26lt;/mx:columns%26gt;
?%26lt;/mx:DataGrid%26gt;
?%26lt;/mx:Canvas%26gt;
?%26lt;mx:ControlBar horizontalAlign=''center'' verticalAlign=''middle''%26gt;
?%26lt;mx:Button id=''btnAdd'' toolTip=''Add file(s)'' click=''addFiles()'' icon=''@Embed('assets/add.png')'' width=''26''/%26gt;
?%26lt;mx:Button id=''btnRemove'' toolTip=''Remove file(s)'' click=''removeFiles()'' icon=''@Embed('assets/delete.png')'' width=''26''/%26gt;
?%26lt;mx:ProgressBar id=''progBar'' mode=''manual'' label='''' labelPlacement=''center'' width=''100%''/%26gt;
?%26lt;mx:Button id=''btnCancel'' toolTip=''Cancel upload'' icon=''@Embed('assets/cancel2.png')'' width=''26'' click=''onUploadCanceled()''/%26gt;
?%26lt;mx:Button label=''Upload'' toolTip=''Upload file(s)'' id=''btnUpload'' click=''startUpload()'' icon=''@Embed('assets/bullet_go.png')''/%26gt;
?%26lt;mx:Button id=''btnView'' toolTip=''Show/Hide file(s)'' icon=''@Embed('assets/application_get.png')'' width=''26'' click=''changeView()''/%26gt;
?%26lt;/mx:ControlBar%26gt;?
%26lt;/mx:Panel%26gt;
Regards,
Shivang
yes, i want to use the fileReferenceList class, but i have not found an example of how to use it without without having to crate a special window to select files. i want to use the default Microsoft file window selector to select multiple files.
You will want to communicate with the browser.?The file name?selected will be returned to the javascript.?Flex will need to read a dom property to get the file name.?Then you'll need to find out if the browser/os will give you a handle to the file for uploading.
Party on!
No comments:
Post a Comment