2 Replies Latest reply on Jul 17, 2008 9:08 PM by nitsmooth

    tile list image display.

    nitsmooth
      i have writen the code for the uploading of images,the images first get displayed in the text area and then after clicking the "button" to display the images in the tile list component but somehow the tile list takes the path of the image rather than the actual image....plz help

      mxml code
      -------------------------
      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" creationComplete="init();" initialize="initData();" width="100%" height="100%">
      <mx:HTTPService id="userRequest" url=" http://localhost/mixbook/return.php" useProxy="false" method="POST">
      <mx:request xmlns="">



      </mx:request>
      </mx:HTTPService>

      <mx:Script>
      <![CDATA[
      import mx.controls.Image;
      import mx.collections.ArrayCollection;
      private var urlRequest:URLRequest;
      private var fileReferenceList:FileReferenceList;
      private var serverSideScript:String = " http://localhost/mixbook/upload_image.php";
      [Bindable]
      public var TileListdp:ArrayCollection;
      private var myArray:Array = new Array;
      import mx.collections.ArrayCollection;
      import mx.controls.TileList;




      private function init():void
      {
      urlRequest = new URLRequest(serverSideScript);
      fileReferenceList = new FileReferenceList();
      fileReferenceList.addEventListener(Event.SELECT, fileSelectedHandler);
      }

      private function uploadFile():void
      {
      fileReferenceList.browse();
      }

      private function fileSelectedHandler(event:Event):void
      {
      var fileReference:FileReference;
      var fileReferenceList:FileReferenceList = FileReferenceList(event.target);
      var fileList:Array = fileReferenceList.fileList;

      // get the first file that the user chose
      fileReference = FileReference(fileList[0]);

      // upload the file to the server side script
      fileReference.addEventListener(Event.COMPLETE, uploadCompleteHandler);
      fileReference.upload(urlRequest);

      // update the status text
      statusText.text = "Uploading...";
      }

      private function uploadCompleteHandler(event:Event):void
      {
      statusText.text = "File Uploaded: " + event.target.name;
      var file:FileReference = FileReference(event.target);
      //var file:FileReference ;
      outputTextArea.htmlText = "<img src='C:\\" + (file.name) + "'/>";
      //myArray.push(outputTextArea.htmlText);
      myArray.push("<img src='C:\\" + (file.name) + "'/>");
      trace(outputTextArea.htmlText);
      }
      public function dodo():void
      {
      var image1:Image = new Image;
      image1.source = outputTextArea.htmlText;
      // myArray.push(outputTextArea.htmlText).valueOf();
      // myArray.push(image1.source);


      TileListdp.source = myArray;
      image1.source =TileListdp.source;
      //TileListdp.source = image1.data;

      }

      private function initData():void
      {
      TileListdp = new ArrayCollection();

      }


      ]]>
      </mx:Script>

      <mx:Label text="Upload File From Flex to PHP" fontWeight="bold"/>
      <mx:Label text="Choose a file..." id="statusText"/>
      <mx:Button click="uploadFile();" label="Upload File"/>
      <mx:TileList x="195" y="10" width="532" dataProvider="{TileListdp}"
      height="207" id="myList" rowHeight="20" columnCount="1" labelField="thumbnail" render="mx.controls.Image" variableRowHeight="true" visible="true" wordWrap="true" includeInLayout="true" direction="vertical" enabled="true"> </mx:TileList>

      <mx:TextArea height="244" id="outputTextArea" width="248"/>
      <mx:Button label="Button" click="dodo();"/>

      </mx:Application>



      php code
      ---------------------

      <?php

      $tempFile = $_FILES['Filedata']['tmp_name'];
      $fileName = $_FILES['Filedata']['name'];
      $fileSize = $_FILES['Filedata']['size'];

      $fp = fopen("test.txt","a+");
      fwrite($fp,$fileName."\r\n");
      move_uploaded_file($tempFile, 'C:\\' . $fileName);
      ?>
      <!--<script type="text/javascript" language="javascript">window.location='C:\Documents and Settings\Manohar\My Documents\Flex Builder 3\sample\bin-debug\dload.html'</script>-->
        • 1. Re: tile list image display.
          ntsiii Level 3
          I do not understand. Please explain further.
          Tracy
          • 2. tile list image display.
            nitsmooth Level 1
            why dont u just run the code u will understand

            actually the mxml file browses the image from the local directory and sends the image to the php code and the php code uploads the image on C drive and then the text area in the mxml file uses this image(uploaded to the C drive by the php) as an "img src=" and then after the "button " is clicked it should get displayed in the tile list but rather than the image itself the tile list shows the path only.......in case there is any doubt plz revert