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
    May 2007
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    [help] Radio Box select with image?

    I am not very familiar with JavaScript and I'm not sure if what I need uses JS. But let me ask anyway.

    I have a form with "radio buttons" and next to each radio box I have an image. When you click on a specific image it will "select" the corresponding radio box.

    I hope this problem is clear, Is there a way of doing this? I would be so grateful for any help or tips!

  • #2
    New to the CF scene
    Join Date
    May 2007
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I have managed to do what I need to do using an onclick on the image, but what I now need is to deselect the other radio buttons when one is selected. So lets say radio box 1 is selected, then radio box 2 and radio box 3 must be deselected. How do you do this?

  • #3
    Senior Coder
    Join Date
    Jun 2002
    Location
    Nashua, NH
    Posts
    1,724
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Learn about <label>s so you do not have to misuse scripting and give the same name to your <input> elements representing radio buttons...
    Vladdy | KL
    "Working web site is not the one that looks the same on common graphical browsers running on desktop computers, but the one that adequately delivers information regardless of device accessing it"

  • #4
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,037
    Thanks
    0
    Thanked 250 Times in 246 Posts
    This is what Vladdy is saying. Scripting not needed.
    Code:
    <input type="radio" name="rad" id="rad1" value="1" /><label for="rad1"><img src="rad1.jpg" alt="" /></label>
    <input type="radio" name="rad" id="rad2" value="2" /><label for="rad2"><img src="rad2.jpg" alt="" /></label>
    <input type="radio" name="rad" id="rad3" value="3" /><label for="rad3"><img src="rad3.jpg" alt="" /></label>


  •  

    Posting Permissions

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