Refreshing image when text changes

Question

I am working with a form. There is a button to upload images to the server. Once the image is uploaded, a form field gets the image file name. I also have an <img scr> which shows a default image. What I need is that when the user uploads an image, this image should be shown instead of the default image. This is the form field that receives the uploaded image file name:

<input type="text" name="imagen" id="imagen" value="" size="32" onInput ="javascript:reloadpic();">

And this is the script that should be launched:

<script type="text/javascript">

        <!--

        function reloadpic()
        {

         alert ("ha cambiado");
         var timestamp = new Date().getTime();
         var image = "http://../platos/"+document.getElementById("imagen").value;
         document.images["imagenplato"].src = image;
         setTimeout("reloadpic();", 1000);
        }



         -->
</script>

But it is never launched. Any help is welcome.

This might be helpful: [Preview an image before it is uploaded](http://stackoverflow.com/questions/4459379/preview-an-image-before-it-is-uploaded) — showdev, Jun 23 '14 at 20:48
remove from your script tag. Right now, your whole function is commented and is undefined. — Nikola R., Jun 23 '14 at 20:48
@AfzaalAhmadZeeshan it does indeed, as you can see, it is written in HTML, not in separate JS file. — Nikola R., Jun 23 '14 at 20:49

score 0 · Answer 1 · answered Jun 23 '14 at 20:49

0

Firstly you're having an input[type="text"] that is not used for image purposes.

I think you need to change that to input[type="file"] and then trigger some events. Maybe you need to change your event to onchange="".

answered Jun 23 '14 at 20:49

Afzaal Ahmad Zeeshan

14,868
10
50
94

Thank you, but the input is correct. On that field is shown the name of the file, not the image itself. On another part of the page is an where the image should be shown. – rzimmerman Jun 23 '14 at 21:58

Refreshing image when text changes

1 Answers1