Results 1 to 9 of 9

Thread: Uncheck a checkbox if another is checked (3 checkboxes)

  1. #1
    Join Date
    Oct 2012
    Posts
    150
    Thanks
    18
    Thanked 1 Time in 1 Post

    Default Uncheck a checkbox if another is checked (3 checkboxes)

    This allows to automatically check / uncheck between 2 checkboxes:

    Javascript:

    Code:
    <script>
    function checkRefresh(value)
    {
        document.form1.submit();
    }  
     
    function uncheck(check)
    {
        var prim = document.getElementById("allcities");
        var secn = document.getElementById("allfeatured");
        if (prim.checked == true && secn.checked == true)
        {
            if(check == 1)
            {
                secn.checked = false;
                checkRefresh();
            }
            else if(check == 2)
            {
                prim.checked = false;
                checkRefresh();
            }
        }
     
    }
    </script>
    HTML:

    HTML Code:
    <input type="checkbox" id="allcities" onClick="uncheck(1);">
    <input type="checkbox" id="allfeatured" onClick="uncheck(2);">
    I want to add a third option:

    HTML Code:
    <input type="checkbox" id="local" onClick="uncheck(3);">

    Can anyone suggest a working solution? Thank you.
    Last edited by qwikad.com; 04-24-2014 at 03:35 PM.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,957
    Thanks
    43
    Thanked 3,195 Times in 3,157 Posts
    Blog Entries
    12

    Default

    Use radio buttons:

    HTML Code:
    <input type="radio" id="allcities" name="locales[]">
    <input type="radio" id="allfeatured" name="locales[]">
    <input type="radio" id="local" name="locales[]">
    That's what they're for. If they all have the same name, only one can be checked. It's automatic, no javascript required.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Oct 2012
    Posts
    150
    Thanks
    18
    Thanked 1 Time in 1 Post

    Default

    Quote Originally Posted by jscheuer1 View Post
    Use radio buttons:

    HTML Code:
    <input type="radio" id="allcities" name="locales[]">
    <input type="radio" id="allfeatured" name="locales[]">
    <input type="radio" id="local" name="locales[]">
    That's what they're for. If they all have the same name, only one can be checked. It's automatic, no javascript required.
    John, the problem is they do not share the same name.

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,957
    Thanks
    43
    Thanked 3,195 Times in 3,157 Posts
    Blog Entries
    12

    Default

    Can't you make them do that? I mean, if they're mutually exclusive, it's only logical for them to have the same name.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. #5
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,794
    Thanks
    2
    Thanked 419 Times in 413 Posts

    Default

    agree with john but

    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 type="text/javascript">
    /*<![CDATA[*/
    function uncheck(){
     var a=uncheck.arguments,z0=0;
     for (;z0<a.length;z0++){
      document.getElementById(a[z0])?document.getElementById(a[z0]).checked=false:null;
     }
    }
    /*]]>*/
    </script></head>
    
    <body>
    <input type="checkbox" id="allcities" onClick="uncheck('allfeatured','local');">
    <input type="checkbox" id="allfeatured" onClick="uncheck('allcities','local');">
    <input type="checkbox" id="local" onClick="uncheck('allcities','allcities');">
    
    </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/

  6. The Following User Says Thank You to vwphillips For This Useful Post:

    qwikad.com (04-24-2014)

  7. #6
    Join Date
    Oct 2012
    Posts
    150
    Thanks
    18
    Thanked 1 Time in 1 Post

    Default

    @vwphillips - very cool.

    The last checkbox should be this: <input type="checkbox" id="local" onClick="uncheck('allcities','allfeatured');">

    But it's working great. Thanks!

  8. #7
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,957
    Thanks
    43
    Thanked 3,195 Times in 3,157 Posts
    Blog Entries
    12

    Default

    I've written code like that in the past, and a part of me is glad you have what you want. But I'm not all that interested these days in writing code that does something already available in ordinary HTML. I would encourage you to investigate the use of forms in general and particularly in this case the use of radio buttons. If not now, then at some future time. Once you have a thorough understanding of what forms are for and what radio buttons do, you may want to rethink what you're doing and find that it's much easier to accomplish using what's already available.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  9. #8
    Join Date
    Oct 2012
    Posts
    150
    Thanks
    18
    Thanked 1 Time in 1 Post

    Default

    Quote Originally Posted by jscheuer1 View Post
    I've written code like that in the past, and a part of me is glad you have what you want. But I'm not all that interested these days in writing code that does something already available in ordinary HTML. I would encourage you to investigate the use of forms in general and particularly in this case the use of radio buttons. If not now, then at some future time. Once you have a thorough understanding of what forms are for and what radio buttons do, you may want to rethink what you're doing and find that it's much easier to accomplish using what's already available.
    I totally get it John. I am just trying to improve user-friendliness of one of my pages where the users have 3 checkboxes to choose from. Only one checkbox can be checked to proceed. Before they would have to uncheck a checked checkbox if they happened to change their minds and wanted to choose a different checkbox. Where's now they won't have to do that. It's really all about user-friendliness and convenience.

    I wish I could accomplish that without javascript, but nothing seemed to be working. Also, I didn't write the original script for that page, so whatever I have in it is what I have to work with.

  10. #9
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,957
    Thanks
    43
    Thanked 3,195 Times in 3,157 Posts
    Blog Entries
    12

    Default

    Radio buttons will do that (enforce that only one may be checked) without javascript.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Similar Threads

  1. How to uncheck-disable, remaing checkboxes
    By gootynz in forum JavaScript
    Replies: 0
    Last Post: 01-24-2012, 01:00 PM
  2. Resolved disable other checkboxes if 3 checkboxes are checked
    By al3bed in forum JavaScript
    Replies: 1
    Last Post: 08-28-2009, 04:41 PM
  3. showing form contents when a checkbox is checked
    By thedash in forum JavaScript
    Replies: 4
    Last Post: 05-19-2009, 06:58 PM
  4. record (unknown num) checked checkboxes values in php/mysql, how ?
    By leonidassavvides in forum MySQL and other databases
    Replies: 0
    Last Post: 08-28-2008, 11:01 AM
  5. How to uncheck one, definite checkbox?
    By theriel in forum JavaScript
    Replies: 6
    Last Post: 09-10-2007, 04:34 PM

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
  •