displaying image after Choose File, before upload

Question

how can after choose image and before upload (before insert in database) displaying image?

this code not displaying image:

var a = $('<img src="' + g.STRING.selected.replace('$file', v) + '" alt="Angry face" width="50" height="50" />'),

<input type="file" name="image' >

With respect

Answer 1

There are Many JavaScript functions written out there to render an image on the page using response.write and these methods all you have to do is search the Google.

but why you want to do a client side display ? even yahoo or many famous site do not handle rendering image in this way... they upload an image in a temporary database and if the user confirms it will be copied in the permanent database.

without server side verification you need many lines of java script code that may behave differently in different browsers.

hope i helped you a bit

Answer 2

I think you can check this tutorial (look at the "New hotness" section) for a jQuery solution

Answer 3

You can use the HTML5 File API (tutorial) to display the selected file. The best way is probably to use a FileReader to get a dataURL of the file and assign it to a src of an img.