Basic javascript
In a form named "Troubleshooting" I have a number of checkboxes. I have 2 that we will call "Option1" and "Option2" which should never be checked at the same time. I know that normally I would use radio buttons but they are being pulled from a database with 10 other checkboxes so it's easiest to just write a script which does the following.
Below is my guess which is not correct. I hope it's at least close enough to let you see what I'm trying to do.
<input type="Checkbox"
name="Option1"
onClick="document.Troubleshooting[Option2].value='off';">Any suggestions?
I know with this if the person is clicking Option1 for the 2nd time (to de-select it) it will still make Option2 unchecked but that's not a big deal for this application.
Thanks for any help.
Art Sapimp
Mark Hensler posted this at 17:27 — 9th October 2001.
He has: 4,048 posts
Joined: Aug 2000
I'm not a JS guy, but here is my untested guess..
<input type="Checkbox"name="Option1"
onClick="document.forms.Troubleshooting.Option2.value='';">
Good Luck,
Mark Hensler
If there is no answer on Google, then there is no question.
artsapimp posted this at 17:45 — 9th October 2001.
They have: 330 posts
Joined: Apr 2000
Thank you, but that did not do the trick.
When I applied that it just acts like there is nothing associated with onClick.
detox posted this at 03:34 — 10th October 2001.
They have: 571 posts
Joined: Feb 2001
on form submission you could do a simple check to see whether both are checked or not, then prompt the user to select only 1 option........
otherwise this script might do the trick. I have commented out an alert which would be optional. It groups two checkboxes together and only allows one to be checked. You can have other checkboxes as well, which wont be affected by the script...
<?php
<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.0 Transitional//EN\">
<html>
<HEAD>
<script LANGUAGE=\"JavaScript\">
function countChoices(obj) {
max = 1; // max. number allowed at a time
box1 = obj.form.box1.checked; // your checkboxes here
box2 = obj.form.box2.checked;
count = (box1 ? 1 : 0) + (box2 ? 1 : 0) ;
// If you have more checkboxes on your form
// add more (box_ ? 1 : 0) 's separated by '+'
if (count > max) {
// alert(\"you can only choose one of these two boxes\")
obj.checked = false;
}
}
</script>
</HEAD>
<BODY>
<center>
<form>
Please choose up to 2 sections:
<p>
<input type=checkbox name=box1 onClick=\"countChoices(this)\">Section 1
<p>
<input type=checkbox name=box2 onClick=\"countChoices(this)\">Section 2
<p>
please not you can only select 1 of the above two options
<p>
<input type=checkbox name=another1 >Section 3
<p>
<input type=checkbox name=another2 >Section 4
<p>
<input type=checkbox name=another3 >Section 5
<p>
</form>
</center>
</body>
</html>
this part of the code always gets chopped off...
?>
artsapimp posted this at 20:11 — 10th October 2001.
They have: 330 posts
Joined: Apr 2000
Thank you very much.
I don't really understand what it's doing in the function and was hoping you could help me understand it a little.
Why (box ? 1 : 0)? What does that mean?
I'm assuming what is the value of the box (1 being on, 0 being off) but I don't understand the syntax. How does that translate?
While typing this I understood the rest of it.
Can you at any time check for a true/false statement like you did with the ? and the : seperating each value? How many values can you use between the :s?
Thanks for your help.
Free Math Test
Fun Math Games
Vincent Puglia posted this at 15:43 — 11th October 2001.
They have: 634 posts
Joined: Dec 1999
Hi artsapimp,
Why (box ? 1 : 0)? What does that mean?
(condition) ? true : false;
if the condition passes, execute the true (between ? and : ) else execute the false (after the : )
...the syntax. How does that translate?
since checkboxes are 'checked', the checked value is either true or false (on or off)
Can you at any time check for a true/false statement like you did with the ? and the : seperating each value?
yes.
How many values can you use between the :s?
theoritically, unlimited. However, you run the risk of confusing the browser, not to mention the programmer.
(browser == netscape) ? ( (version == '4.7')? (document.layers) : (document.getElementById) ) : ( (version < '5.5') ? (document.all) : (document.getElementById) )
BTW here's another solution to your original problem:
and more in flavor with radio buttons:
Vinny
Where the world once stood
the blades of grass cut me still
artsapimp posted this at 16:22 — 11th October 2001.
They have: 330 posts
Joined: Apr 2000
Thank you very much.
That all makes sense and I will be using it more than just for this application.
Thanks again for your help.
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.