# Show image on button click

**URL:** <https://forum.kirupa.com/t/show-image-on-button-click/316697>\
**Category:** Uncategorized\
**Created:** [November 30, 2010, 6:10am UTC](https://forum.kirupa.com/t/show-image-on-button-click/316697 "2010-11-30T06:10:17Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![krunalkakadia](https://avatars.discourse-cdn.com/v4/letter/k/e56c9b/32.png) [@krunalkakadia](https://forum.kirupa.com/u/krunalkakadia)\
**Post date:** [November 30, 2010, 6:10am UTC](https://forum.kirupa.com/t/show-image-on-button-click/316697/1 "2010-11-30T06:10:17Z")

</div>

hi guys,

pl help me.What i am going to do is that when i browse an image and click on button, the image file name should be display in textbox and image file sholud be display in image.

i have display filename in textbox but i don’t how to show image file in image?

here is the code:

**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]private[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2][COLOR=#0033ff]  
[LEFT][/COLOR][/SIZE]**[SIZE=2][COLOR=#339966][SIZE=2][COLOR=#339966]function[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2] init():[/SIZE]**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]void[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2]{[/SIZE]

[SIZE=2]fileRef=[/SIZE]**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]new[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2] FileReference();[/SIZE]  
[LEFT][SIZE=2]fileRef.addEventListener(Event.SELECT,SelectFile);[/SIZE]  
_[SIZE=2][COLOR=#009900][SIZE=2][COLOR=#009900]// fileRef.addEventListener(Event.COMPLETE,browseComplete);[/COLOR][/SIZE][/COLOR][/SIZE]_  
[SIZE=2]}[/SIZE][/LEFT]  
[/LEFT]

[LEFT]**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]private[/COLOR][/SIZE][/COLOR][/SIZE]\*\*\*\*[SIZE=2][COLOR=#339966][SIZE=2][COLOR=#339966]function[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2] fileUpload(event:Event):[/SIZE]**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]void[/COLOR][/SIZE][/COLOR][/SIZE]**  
[LEFT][SIZE=2]{[/SIZE]  
_[SIZE=2][COLOR=#009900][SIZE=2][COLOR=#009900][//fileRef.browse](https://fileRef.browse)();[/COLOR][/SIZE][/COLOR][/SIZE]_  
[SIZE=2]fileRef.browse([fileFilter]);[/SIZE][/LEFT]  
[/LEFT]

[LEFT][SIZE=2]}[/SIZE]  
[LEFT]**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]private[/COLOR][/SIZE][/COLOR][/SIZE]\*\*\*\*[SIZE=2][COLOR=#339966][SIZE=2][COLOR=#339966]function[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2] SelectFile(event:Event):[/SIZE]**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]void[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2]{[/SIZE]  
[SIZE=2]fileRef.load();[/SIZE]  
[SIZE=2]txtBrowseFile.text=fileRef.name;[/SIZE]  
[SIZE=2][//img1.source=](https://img1.source=)"/"+fileRef.name;[/SIZE]  
_[SIZE=2][COLOR=#009900][SIZE=2][COLOR=#009900][//img2.source=](https://img2.source=)‘fileRef.name’;[/COLOR][/SIZE][/COLOR][/SIZE]_  
_[SIZE=2][COLOR=#009900][SIZE=2][COLOR=#009900][//fileRef.upload](https://fileRef.upload)(new URLRequest(fileFilter));[/COLOR][/SIZE][/COLOR][/SIZE]_  
[SIZE=2]}[/SIZE]  
**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]private[/COLOR][/SIZE][/COLOR][/SIZE]\*\*\*\*[SIZE=2][COLOR=#339966][SIZE=2][COLOR=#339966]function[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2] clickEvt(event:ItemClickEvent):[/SIZE]**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]void[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2] {[/SIZE]  
_[SIZE=2][COLOR=#009900][SIZE=2][COLOR=#009900]// Access target TabBar control.[/COLOR][/SIZE][/COLOR][/SIZE]_  
**[SIZE=2][COLOR=#6699cc][SIZE=2][COLOR=#6699cc]var[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2] targetComp:TabBar = TabBar(event.currentTarget);[/SIZE][/LEFT]  
[/LEFT]

[LEFT]**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]if[/COLOR][/SIZE][/COLOR][/SIZE]**SIZE=2[/SIZE]  
[LEFT][SIZE=2]{[/SIZE]  
[SIZE=2]vboxSelectFile.visible=[/SIZE]**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]true[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2];[/SIZE]  
[SIZE=2]vboxSelectFile.includeInLayout=[/SIZE]**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]true[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2];[/SIZE]  
[SIZE=2]vboxColorPicker.visible=[/SIZE]**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]false[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2];[/SIZE]  
[SIZE=2]vboxColorPicker.includeInLayout=[/SIZE]**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]false[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2];[/SIZE]  
[SIZE=2]}[/SIZE]  
**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]if[/COLOR][/SIZE][/COLOR][/SIZE]**SIZE=2[/SIZE]  
[SIZE=2]{[/SIZE]  
[SIZE=2]vboxSelectFile.visible=[/SIZE]**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]false[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2];[/SIZE]  
[SIZE=2]vboxSelectFile.includeInLayout=[/SIZE]**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]false[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2];[/SIZE]  
[SIZE=2]vboxColorPicker.visible=[/SIZE]**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]true[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2];[/SIZE]  
[SIZE=2]vboxColorPicker.includeInLayout=[/SIZE]**[SIZE=2][COLOR=#0033ff][SIZE=2][COLOR=#0033ff]true[/COLOR][/SIZE][/COLOR][/SIZE]**[SIZE=2];[/SIZE]  
[SIZE=2]}[/SIZE][/LEFT]

[SIZE=2]} [/SIZE][/LEFT]

[LEFT][SIZE=2]UI code:[/SIZE]

[SIZE=2][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]\<mx:VBox[/COLOR][/SIZE][/COLOR][/SIZE][/SIZE][/LEFT]  
[SIZE=2][SIZE=2][COLOR=#0000ff]

[LEFT][/COLOR][/SIZE][SIZE=2]width="[/SIZE][SIZE=2][COLOR=#990000][SIZE=2][COLOR=#990000]50%[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]" id="[/SIZE][SIZE=2][COLOR=#990000][SIZE=2][COLOR=#990000]vboxSelectFile[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]" height="[/SIZE][SIZE=2][COLOR=#990000][SIZE=2][COLOR=#990000]40%[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]"[/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]\>[/COLOR][/SIZE][/COLOR][/SIZE]

[SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]\<mx:Label[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2] id="[/SIZE][SIZE=2][COLOR=#990000][SIZE=2][COLOR=#990000]lblSelectFile[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]" text="[/SIZE][SIZE=2][COLOR=#990000][SIZE=2][COLOR=#990000]Select File[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]" [/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]/\>[/COLOR][/SIZE][/COLOR][/SIZE]  
[LEFT][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]\<mx:TextInput[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2] id="[/SIZE][SIZE=2][COLOR=#990000][SIZE=2][COLOR=#990000]txtBrowseFile[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]" width="[/SIZE][SIZE=2][COLOR=#990000][SIZE=2][COLOR=#990000]100%[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]" [/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]/\>[/COLOR][/SIZE][/COLOR][/SIZE]  
[SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]\<mx:Button[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2] id="[/SIZE][SIZE=2][COLOR=#990000][SIZE=2][COLOR=#990000]btnUpload[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]" label="[/SIZE][SIZE=2][COLOR=#990000][SIZE=2][COLOR=#990000]Upload[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2]" click=“fileUpload(event)” [/SIZE][SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]/\>[/COLOR][/SIZE][/COLOR][/SIZE][/LEFT]

[SIZE=2][COLOR=#0000ff][SIZE=2][COLOR=#0000ff]\</mx:VBox\>[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=2][COLOR=#0000ff][/LEFT]  
[/COLOR][/SIZE][/SIZE]