By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,287 Members | 1,545 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,287 IT Pros & Developers. It's quick & easy.

Problem with form checkboxes

100+
P: 263
I need one function javascript that:

1) when I enter in this htm page I see enabled only checkbox of categories A, M and T; checkboxes of microcategories all disabled;

2-a) If I select the checkbox of macrocategory A, M and T checkboxes all disabled;
2-b) If I select the checkbox of macrocategory M, A and T checkboxes all disabled;
2-c) If I select the checkbox of macrocategory T, A and M checkboxes all disabled;

3) If I select the checkbox macrocategory A enable only the checkboxes of microcategories corresponding to macrocategory A;
4) If I select the checkbox macrocategory M enable only the checkboxes of microcategories corresponding to macrocategory M;
5) If I select the checkbox macrocategory T enable only the checkboxes of microcategories corresponding to macrocategory T;

6) One checkbox of macrocategory and one checkbox of microcategory selected for the form it's valid.


My form in the page htm:

Expand|Select|Wrap|Line Numbers
  1. <form.... >
  2.  
  3. <input type="checkbox" name="A" value="A">A
  4. <input type="checkbox" name="IN" value="IN">IN<br>
  5. <input type="checkbox" name="IS" value="IS">IS<br>
  6. <input type="checkbox" name="PA" value="PA">PA<br>
  7.  
  8. <input type="checkbox" name="M" value="M">M
  9. <input type="checkbox" name="IN" value="IN">IN<br>
  10. <input type="checkbox" name="IS" value="IS">IS<br>
  11. <input type="checkbox" name="PA" value="PA">PA<br>
  12.  
  13. <input type="checkbox" name="T" value="T">T
  14. <input type="checkbox" name="IN" value="IN">IN<br>
  15. <input type="checkbox" name="IS" value="IS">IS<br>
  16. <input type="checkbox" name="PA" value="PA">PA<br>
  17.  
  18. </form>
  19.  
Nov 13 '09 #1
Share this Question
Share on Google+
7 Replies


acoder
Expert Mod 15k+
P: 16,027
My suggestion:

Use radio buttons for A, M & T; and only have one set of radio buttons for IN, IS and PA:
Expand|Select|Wrap|Line Numbers
  1. <form.... >
  2.  
  3. <input type="radio" name="macro" value="A">A
  4. <input type="radio" name="macro" value="M">M
  5. <input type="radio" name="macro" value="T">T
  6. <input type="radio" name="macrosub" value="IN">IN<br>
  7. <input type="radio" name="macrosub" value="IS">IS<br>
  8. <input type="radio" name="macrosub" value="PA">PA<br>
  9.  
  10. </form>
  11.  
Should solve your problem without JavaScript.
Nov 13 '09 #2

100+
P: 263
Many thanks Acoder for your suggestion, but I need use this page htm as explained... can you help me?
Nov 13 '09 #3

Dormilich
Expert Mod 5K+
P: 8,639
Acoderís code exactly fits requirements 3 to 6.
requirement 2 does not apply (you canít select more than one)
Nov 14 '09 #4

acoder
Expert Mod 15k+
P: 16,027
And requirement 1 is no longer needed either.

If you insist (or more for the benefit of someone wanting to know how it could be done), set the disabled property of the checkboxes to true/false to disable/enable when a checkbox is clicked. To decide whether to enable/disable, check the "checked" property:
Expand|Select|Wrap|Line Numbers
  1. if (chkbox.checked) {
  2.     // enable/disable checkboxes here
  3. }
My opinion: too much unnecessary code for something that can be done with pure HTML. If you want an alternative to radio buttons, use two select boxes:
Expand|Select|Wrap|Line Numbers
  1. <select ...>
  2. <option ...>...</option>
  3. ...
  4. </select>
Nov 14 '09 #5

100+
P: 263
Try this page:
http://www.avia-it.com/testaruba/
Nov 14 '09 #6

100+
P: 263
I have changed the input checkbox with input radio:

http://www.avia-it.com/testaruba/

But I have problem with control the exact combination of the radio:

It's OK: http://www.avia-it.com/testaruba/immagine_1.jpg
it's KO: http://www.avia-it.com/testaruba/immagine_2.jpg

Can you help me?
Nov 17 '09 #7

acoder
Expert Mod 15k+
P: 16,027
Hmm, ok, it seems you didn't describe the problem properly in the first post.

I assumed that all 3 main options A, M and T had the same sub-options. Since it isn't, and the list of options is long, it would probably be more appropriate to use select drop-downs. Then when, for example, M is selected, the corresponding options are loaded into the second drop-down.

3 basic steps:
1. An array containing the options
2. Two drop-downs in the HTML
3. When the first drop-down option is changed, load the new options into the second one.

PS. you could go the way that you originally stated with checkboxes, but that takes up too much space on the screen.
Nov 18 '09 #8

Post your reply

Sign in to post your reply or Sign up for a free account.