PDA

View Full Version : Resolved Uncheck a checkbox if another is checked (3 checkboxes)



qwikad.com
04-24-2014, 01:39 AM
This allows to automatically check / uncheck between 2 checkboxes:

Javascript:


<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:


<input type="checkbox" id="allcities" onClick="uncheck(1);">
<input type="checkbox" id="allfeatured" onClick="uncheck(2);">

I want to add a third option:


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


Can anyone suggest a working solution? Thank you.

jscheuer1
04-24-2014, 03:25 AM
Use radio buttons:


<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.

qwikad.com
04-24-2014, 01:49 PM
Use radio buttons:


<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.

jscheuer1
04-24-2014, 01:52 PM
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.

vwphillips
04-24-2014, 02:44 PM
agree with john but


<!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>

qwikad.com
04-24-2014, 03:24 PM
@vwphillips - very cool.

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

But it's working great. Thanks!

jscheuer1
04-24-2014, 04:43 PM
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.

qwikad.com
04-24-2014, 05:44 PM
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.

jscheuer1
04-24-2014, 08:07 PM
Radio buttons will do that (enforce that only one may be checked) without javascript.