image preview

hi, I have a form with a uploader , after the upload of a jpg file I would like to see the preview of the image file uploaded to the server .
How could I do ?
Thank you

Hi, you can embed the image(s) to the Template, or any data component (List, Dataview) with the help of uploader link property. It syncs uploader file storage with the component data.

So you will only need to define a proper template to visualize the image, e.g.:

view:"list", 
template:"<img src='path/to/folder/#name#'/>"

Please check the available samples (they show file names):

thanks very good

thanks for help, I explained wrong and I did not understand forgive me .
I used the widget uploader etc…etc , but I do not want to display the name or the file path , but I really want to see it . Image exists not a widget ? or something like that?
Thank you

sorry! i dont understand! i resolve it ! sorry :slight_smile:

how can change template string on load event form?i can change attribute template? thanks

I kown it’s an old question, but what if I want to preview the image in another component? I’ts possible?

You can either sync Uploader and component data by pointing to the necessary component with the link property, or work with Uploader file storage directly as uploader.files.data.

Please be more specific, how to preview image into Template on “onBeforeFileAdd” or “onAfterFileAdd” events?

@predragmilutinovic there’s no built-in solution

You can get the file as

onBeforeFileAdd:function(item){ item.file }

And use FileReader API to get the image: