Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Sep 2008
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Change Image URL when cleint changes path in textbox

    I am having some trouble in changing the img scr when the textbox location has been changed.

    For example.

    this is filled in the Textbox > images/client/"theimagetheyhaveuploaded.gif"

    when it has been filled in the Preview of the image is showen on the same page.

    This is how i set the url of the picture.

    <input class="text" type="text" name="image_small_{image_index}" value="{picture_small}" size="50" maxlength="255" onchange="document.getElementById('preview_image').innertext=this.value"/>

    If i want to diplay the text in the textbox further down the page i fill in

    <td id="preview_image"></td> This will display what has been filled in the textbox.

    But i want to use the set value "preview_image" as a url where the picture is located.

    This is what i want to do.

    <td align="right"><img scr="preview_image"></td>

    Of course this does not work but what should i do?

  • #2
    Senior Coder rangana's Avatar
    Join Date
    Feb 2008
    Location
    Cebu City, Philippines
    Posts
    1,752
    Thanks
    65
    Thanked 372 Times in 365 Posts
    Quote Originally Posted by ScottNL1 View Post
    This is what i want to do.

    <td align="right"><img scr="preview_image"></td>

    Of course this does not work but what should i do?
    If you mean it literally, then it will not work since there is no scr attribute, you mean to use src instead.

    For your problem, mind rephrasing it and showing a complete code instead
    Learn how to javascript at 02geek

    The more you learn, the more you'll realize there's much more to learn
    Ray.ph

  • #3
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,518
    Thanks
    3
    Thanked 506 Times in 493 Posts
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    
    <head>
      <title></title>
    <script language="JavaScript" type="text/javascript">
    /*<![CDATA[*/
    function  CngImg(ip,id){
     var img=document.getElementById(id);
     var imgobj=new Image();
     imgobj.src=ip.value;
     if (!img.defaultimg) img.defaultimg=img.src;
     img.src=img.defaultimg;
     CkComplete(img,imgobj);
    }
    
    function CkComplete(img,imgobj){
     if (imgobj.complete)  img.src=imgobj.src;
     else img.to=setTimeout(function(){CkComplete(img,imgobj)},500)
    }
    
    /*]]>*/
    </script></head>
    
    <body>
    <input class="text" type="text" name="image_small_{image_index}" value="{picture_small}" size="50" maxlength="255" onblur="CngImg(this,'tst');" /><br />
    <img id="tst" src="http://www.vicsjavascripts.org.uk/StdImages/Blank.gif" />
    <br />
    <br />
    Valid Test Images<br />
    http://www.vicsjavascripts.org.uk/StdImages/Two.gif<br />
    http://www.vicsjavascripts.org.uk/StdImages/Three.gif<br />
    http://www.vicsjavascripts.org.uk/StdImages/Four.gif<br />
    </body>
    
    </html>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • Users who have thanked vwphillips for this post:

    ScottNL1 (09-09-2008)

  • #4
    New to the CF scene
    Join Date
    Sep 2008
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Vic Thanks allot, works perfect. Added you're website to my fav.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •