Click on an Image, and set radio button value to true

Discussion in 'Javascript' started by ameshkin, Jul 19, 2008.

  1. ameshkin

    ameshkin Guest

    Hi guys,

    I'm a pretty good PHP programmer, but when it comes to JS, I just dont
    understand it! But I really need to learn. I'm having trouble doing
    the simplest thing!

    When someone clicks on this image, I want the radiobutton above it to
    be checked. Not that hard,but nothing I try seems to work. Can
    someone please help me?


    <form id="form1" method="post" action="">
    <input type="radio" name="radio" id="svc_tp_1" value="svc_tp_04" /></
    td>
    <img src="images/print.jpg" onClick="check('svc_tp_1')" />
    ameshkin, Jul 19, 2008
    #1
    1. Advertising

  2. ameshkin

    dcx Guest

    Do you really need javascript?

    Why not:

    <label><input type="radio"/><img/></label>
    dcx, Jul 19, 2008
    #2
    1. Advertising

  3. ameshkin wrote:
    > I'm a pretty good PHP programmer, but when it comes to JS, I just dont
    > understand it! But I really need to learn. I'm having trouble doing
    > the simplest thing!


    Apparently.

    > When someone clicks on this image, I want the radiobutton above it to
    > be checked. Not that hard,but nothing I try seems to work. Can
    > someone please help me?
    >
    > <form id="form1" method="post" action="">
    > <input type="radio" name="radio" id="svc_tp_1" value="svc_tp_04" /></
    > td>
    > <img src="images/print.jpg" onClick="check('svc_tp_1')" />


    Reduced to the necessary minimum (HTML 4.01 Transitional) and all invalid
    code dumped to /dev/null:

    <form action="" method="post">
    <input type="radio" name="radio" id="svc_tp_1" value="svc_tp_04"
    ><label for="svc_tp_1"><img

    src="images/print.jpg" alt="Print"></label>
    <input type="submit">
    </form>

    Sorry, looks like there is no JS in there. But maybe someone else comes up
    with a fully-fledged scripted solution that introduces the accessibility issue.


    PointedEars
    --
    Use any version of Microsoft Frontpage to create your site.
    (This won't prevent people from viewing your source, but no one
    will want to steal it.)
    -- from <http://www.vortex-webdesign.com/help/hidesource.htm>
    Thomas 'PointedEars' Lahn, Jul 19, 2008
    #3
  4. Jim Carlock wrote:
    > "dcx" <> wrote:
    > : <label><input type="radio"/><img/></label>
    >
    > Is that something new?


    No, it turns 10 on December 24 next year.

    > It doesn't look like HTML nor XHTML.


    *The above* is not. However, it can be written as Valid HTML 4.01 or
    XHTML 1.x. See my other reply.

    > I'm curious. Did I miss out on something?


    Obviously.

    <http://www.w3.org/TR/REC-html40/>


    PointedEars
    --
    Anyone who slaps a 'this page is best viewed with Browser X' label on
    a Web page appears to be yearning for the bad old days, before the Web,
    when you had very little chance of reading a document written on another
    computer, another word processor, or another network. -- Tim Berners-Lee
    Thomas 'PointedEars' Lahn, Jul 19, 2008
    #4
  5. ameshkin

    Suhas Dhoke Guest

    On Jul 19, 4:37 am, ameshkin <> wrote:
    > Hi guys,
    >
    > I'm a pretty good PHP programmer, but when it comes to JS, I just dont
    > understand it!  But I really need to learn.  I'm having trouble doing
    > the simplest thing!
    >
    > When someone clicks on this image, I want the radiobutton above it to
    > be checked.  Not that hard,but nothing I try seems to work.  Can
    > someone please help me?
    >
    > <form id="form1" method="post" action="">
    > <input type="radio" name="radio" id="svc_tp_1" value="svc_tp_04" /></
    > td>
    > <img src="images/print.jpg" onClick="check('svc_tp_1')" />



    If you really want to select the radio button, by using JavaScript,
    without using <label> element,
    then the following code will help you.


    <img src="images/print.jpg" alt="Print"
    onClick="document.getElementById('id_of_your_radio_button').checked =
    true;">
    Suhas Dhoke, Jul 19, 2008
    #5
  6. ameshkin

    Evertjan. Guest

    Suhas Dhoke wrote on 19 jul 2008 in comp.lang.javascript:

    > If you really want to select the radio button, by using JavaScript,
    > without using <label> element,
    > then the following code will help you.
    >
    >
    > <img src="images/print.jpg" alt="Print"
    > onClick="document.getElementById('id_of_your_radio_button').checked
    > true;">
    >


    ......).checked = true;">



    --
    Evertjan.
    The Netherlands.
    (Please change the x'es to dots in my emailaddress)
    Evertjan., Jul 19, 2008
    #6
  7. ameshkin

    SAM Guest

    Jim Carlock a écrit :
    > "dcx" <> wrote:
    > : <label><input type="radio"/><img/></label>
    >
    > Is that something new? It doesn't look like HTML nor XHTML. I'm
    > curious. Did I miss out on something?



    <label> in forms is pure html

    very useful for accessibility


    <p><label for="theId">Please hit me to check the radio button choice
    1</label>
    <input type="radio" id="theId" name="choice" tabindex=10
    value="choice_1"> choice 1</p>

    So that could work with an image

    <p>
    <label for="theId">
    <img src="choice_1.gif" alt="button helper"
    tittle="hit me to check choice 1">
    </label>
    <input type="radio" id="theId" name="choice"
    tabindex=10 value="choice_1">
    choice 1
    </p>


    --
    sm
    SAM, Jul 19, 2008
    #7
  8. ameshkin

    ameshkin Guest

    On Jul 18, 4:37 pm, ameshkin <> wrote:
    > Hi guys,
    >
    > I'm a pretty good PHP programmer, but when it comes to JS, I just dont
    > understand it!  But I really need to learn.  I'm having trouble doing
    > the simplest thing!
    >
    > When someone clicks on this image, I want the radiobutton above it to
    > be checked.  Not that hard,but nothing I try seems to work.  Can
    > someone please help me?
    >
    > <form id="form1" method="post" action="">
    > <input type="radio" name="radio" id="svc_tp_1" value="svc_tp_04" /></
    > td>
    > <img src="images/print.jpg" onClick="check('svc_tp_1')" />


    onClick="document.getElementById('svc_tp_2').checked =
    true;"

    Thanks guys,
    The above is exactly what I was lookng for. i almost had it myself,
    but because of a typo, it did not work correctly!

    I really need to buy a js book. Javascript is not really powerful,
    but there are many things you can do with it that are impossible with
    other languages, which does make it very powerful in its own way.
    ameshkin, Jul 21, 2008
    #8
  9. ameshkin wrote:
    > [...]
    > onClick="document.getElementById('svc_tp_2').checked = true;"
    >
    > Thanks guys,
    > The above is exactly what I was lookng for.


    It's not. To begin with, it uses host object's methods without
    feature-testing for them first.

    > i almost had it myself, but because of a typo, it did not work correctly!
    >
    > I really need to buy a js book.


    Hardly. In fact, at this point my recommendation stands that no book about
    JS is worth buying for a beginner. There is plenty of reference material
    online, for free. While subscribing to this newsgroup and reading regularly
    is generally a good idea when attempting to learn the language(s), you
    should start with the newsgroup's FAQ <http://jibbering.com/faq/> and go
    from there.

    > Javascript is not really powerful, [...]


    As a *beginner* talking about *"Javascript"* when there is no such language,
    you are not exactly in a position to correctly assess the power of the
    several different implementations of the ECMAScript Language Specification.

    <http://PointedEars.de/es-matrix>


    HTH

    PointedEars
    --
    Use any version of Microsoft Frontpage to create your site.
    (This won't prevent people from viewing your source, but no one
    will want to steal it.)
    -- from <http://www.vortex-webdesign.com/help/hidesource.htm>
    Thomas 'PointedEars' Lahn, Jul 22, 2008
    #9
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Purvi T
    Replies:
    0
    Views:
    829
    Purvi T
    Oct 19, 2004
  2. David Wier
    Replies:
    0
    Views:
    627
    David Wier
    Aug 27, 2003
  3. Amy
    Replies:
    0
    Views:
    974
  4. bdb112
    Replies:
    45
    Views:
    1,334
    jazbees
    Apr 29, 2009
  5. Hiten
    Replies:
    1
    Views:
    616
    Vidar Petursson
    May 26, 2004
Loading...

Share This Page