SitePoint Sponsor

User Tag List

Results 1 to 14 of 14
  1. #1
    SitePoint Addict
    Join Date
    Feb 2000
    Location
    Minnesota
    Posts
    317
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    javascript to toggle between two checkboxes?

    Can anyone help?
    Thanks
    Keomed.com Webmaster
    www.keomed.com

  2. #2
    Currently Occupied; Till Sunda Andrew-J2000's Avatar
    Join Date
    Aug 2001
    Location
    London
    Posts
    2,475
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    PHP Code:
    var ckBx=document.getElementsByTagName('input');
    function switch()
    {
    if (
    ckBx[0].checked!=falseckBx[0].checked=true;
    else 
    ckBx[1].checked=false;


  3. #3
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    How on EARTH you got what he meant first time will ALWAYS be beyond me

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  4. #4
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    and what's wrong with radio buttons.

    I also thought that if you gave two checkboxes 1 name they'd toggle automatically.
    Never tried it though.

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  5. #5
    Currently Occupied; Till Sunda Andrew-J2000's Avatar
    Join Date
    Aug 2001
    Location
    London
    Posts
    2,475
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    How on EARTH you got what he meant first time will ALWAYS be beyond me
    actually I thought it made sense, toggle means one thing which is switching, but i'm awaiting your better method now, as per usual

    ps dont leave me in suspense:P

  6. #6
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    lol

    I don't really have one except for the comment above.

    I think i'd use something more inline for it rather than a funciton.

    ie:
    in the input onclick (given the fields are next to each other:

    this.previousSibling.checked=0;

    this.nextSibling.checked=0;

    That way when you click on one, it will turn the other off automatically.

    Is this the right approach or not do you think Andrew?

    (you don't loose anything by the first click - it'll turn it off when it's off.
    However it doesn't do much for clicking on the one that's already ON... except turning it off and the other off.... maybe developing this would take too much?

    if so - maybe use anti objects to refer:
    var object1="object2";
    var object2="object1";

    (or you could be REALLY cunning and use the id's previousSibling and nextSibling and eval them to get the opposite function.

    what you think?

    I'm really straining to go one up, when your answer
    was fine, btw, but only coz you asked me to

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  7. #7
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sh*t - I've just noticed!

    You've used your reference to the elements by the collection "inputs".
    This means that they have to be first and second elements in the collection.
    And it means you can't have multiple toggles.

    You'd really want to use the:
    document.getElementsByClassName("toggle");

    instead, still only given one set of toggles though.

    The better way of doing it would be the nextSibling and previousSibling method.

    Is there a requirement for me to go through this and explain it?

    thanks

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  8. #8
    Currently Occupied; Till Sunda Andrew-J2000's Avatar
    Join Date
    Aug 2001
    Location
    London
    Posts
    2,475
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    nah, I will let you off with this one hehe, no demo needed :P, But when he did mention toggle I just thought he meant a straight switch , It reminds me that I really must start looking into the dom as i've been looking at xml etc.

  9. #9
    SitePoint Addict
    Join Date
    Feb 2000
    Location
    Minnesota
    Posts
    317
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hmmm....I can't seem to get it to work.
    How do I apply this to my checkboxes?
    Thanks

    Code:
    <input type="checkbox" onClick="switch();" name="hospital_affiliated" value="1" checked>
    YES &nbsp;&nbsp; 
    <input type="checkbox" onClick="switch();" name="hospital_affiliated" value="2">
    NO &nbsp;&nbsp;
    Keomed.com Webmaster
    www.keomed.com

  10. #10
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    you need the function.

    Andrew... although our conversation was useful... i somewhat think it might have been in vain

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  11. #11
    SitePoint Addict
    Join Date
    Feb 2000
    Location
    Minnesota
    Posts
    317
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I just didn't copy it here.

    Code:
    <script language="JavaScript" type="text/javascript">
    var ckBx=document.getElementsByTagName('hospital_affiliated');
    function switch()
    {
    if (ckBx[0].checked!=false) ckBx[0].checked=true;
    else ckBx[1].checked=false;
    }   
    </script>
    What am I doing wrong?
    thanks!
    Keomed.com Webmaster
    www.keomed.com

  12. #12
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    probably the number of inputs on your page
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  13. #13
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    probably the number of inputs on your page
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  14. #14
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    In terms of best practice, form controls should be used as they were intended - radio buttons for mutually exclusive options, and checkboxes for options which are independent of each other.

    You seem to be trying to use checkboxes to do the work of radio buttons! Although it can be done, it is recommended that you use radio buttons instead, as users will be familiar with the way they work, whereas mutually exclusive checkboxes are not something that they will be used to. This will merely serve to confuse the user rather than help him.

    Perhaps there is a particular reason (other than aesthetics) that you want to use checkboxes rather than radio buttons - if so, what is it?


    M@rco


Bookmarks

Posting Permissions

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