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 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Mar 2004
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    how to change the image of a particular cell in a table

    Hello all,
    I have five images as buttons and what I am trying to do is when I click on any of these buttons a corresponding image will be loaded in a cell of a table.
    Those five images are also stored in five table cells.
    Now the problem here is just to change that particular image on response of a click.

  • #2
    Senior Coder
    Join Date
    Feb 2004
    Posts
    1,206
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Well it'd be nice to see some code, but I'm going by this example:
    http://www.web-source.net/html_image_submit.htm

    So if you change this line:
    Code:
    <INPUT type=image name="search" src="graphics/searchgo.gif" border="0">
    to:
    Code:
    <INPUT type=image name="search" src="graphics/searchgo.gif" border="0" onClick="changeImage(this)">
    Then you'd need the javascript function:
    Code:
    function changeImage(inputImage) {
     if(inputImage.src == "somePic1.jpg") {
      inputImage.src = "newPic1.jpg";
     }
     else if(inputImage.src == "somePic2.jpg") {
      inputImage.src = "newPic2.jpg";
     }
     ...
    }
    Hopefully that give you a good idea.

    Sadiq.

  • #3
    New to the CF scene
    Join Date
    Mar 2004
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    thanks for ur reply.
    <INPUT type=image name="search" src="graphics/searchgo.gif" border="0" onClick="changeImage(this)">
    In the src="graphics/searchgo.gif" whats the graphics means here?
    its a path or anything else ?

  • #4
    Senior Coder
    Join Date
    Feb 2004
    Posts
    1,206
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yes. graphics/ is a directory holding the searchgo.gif file.

    If your picture file is in the same directory as yourhtml file, then you can omit the "graphics/" part.

    Sadiq.

  • #5
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,068
    Thanks
    0
    Thanked 256 Times in 252 Posts
    input type=image is a submit button (just like input type=submit)
    To cancel the form submission, you should return false to the onclick handler.

    <input type="image" name="search" src="graphics/searchgo.gif" border="0" onclick="changeImage(this);return false" />

    or:

    <input type="image" name="search" src="graphics/searchgo.gif" border="0" onclick="return changeImage(this);" />

    function changeImage(inputImage){
    ...
    return false;//last statement
    }
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________


  •  

    Posting Permissions

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