Link to home
Start Free TrialLog in
Avatar of bangviz
bangviz

asked on

how to check a check box

Hi,

For example i have 2 checkboxes A and B, If i check B then A should also get checked....

But if i check A, B shouldn't get checked untill u force it to check....

Can anyone post the sample code....ASAP....

cheers
ASKER CERTIFIED SOLUTION
Avatar of JonFish85
JonFish85

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of JonFish85
JonFish85

that code is incorrect according to what you asked... Try this instead:

<HTML>
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">
<TITLE></TITLE>
<SCRIPT language=javascript>
function DoIt()
{
  if (t2.checked)
  {
    t1.checked = true;
  }
}
</SCRIPT>
</HEAD>
<BODY>

<INPUT type=checkbox id=t1>A</INPUT><BR>
<INPUT type=checkbox id=t2 onclick="DoIt();">B</INPUT>

</BODY>
</HTML>
<form name=frmg>
<input type=checkbox name=chkA>A
<input type=checkbox name=chkB onclick='document.frmg.chkA.checked=this.checked'>B
</form>
Avatar of SnowFlake
since you didnt say that when unchecking B A should be also unchecked :

<form name=frmg>
<input type=checkbox name=chkA>A
<input type=checkbox name=chkB onclick='if (this.checked) {document.frmg.chkA.checked=true}'>B
</form>

SnowFlake

according to your requirement, when B is checked, and when the user clicks on A, then A should not get unchecked.
I hope this is what you need.

Also when the user clicks on B, A should be checked

This will do that

<form name=frmg>
<input type=checkbox name=chkA onclick='if(document.frmg.chkB.checked)this.checked=true'>A
<input type=checkbox name=chkB onclick='document.frmg.chkA.checked=this.checked'>B
</form>

rgds
jcs
nice, thats what you get when posting 300 points q's :)

well all have to wait now and see which of the Q's interpertations best fits bangviz's requierments.

SnowFlake.
This works fine.


<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT language=javascript>
function DoIt()
{
 if (t2.checked)
 {
   t1.checked = true;
 }
}
function checkA()
{
 if (t1.checked && confirm('Do you want to check B now?'))
 {
   t2.checked = true;
 }
}

</SCRIPT>
</HEAD>
<BODY>

<INPUT type=checkbox id=t1 onclick="checkA();">A</INPUT><BR>
<INPUT type=checkbox id=t2 onclick="DoIt();">B</INPUT>

</BODY>
</HTML>
Avatar of bangviz

ASKER

Thanks JonFish85 for ur comments

I still have one more issue....which striked...

Suppose both are checked(If i check B then A should also get checked)and if i try to uncheck A then even B should also gets unchecked.

Can anyone post the comments/code.....

cheers
Avatar of bangviz

ASKER

Thanks JonFish85 for ur comments

I still have one more issue....which striked...

Suppose both are checked(If i check B then A should also get checked)and if i try to uncheck A then even B should also gets unchecked.

Can anyone post the comments/code.....

cheers
Avatar of bangviz

ASKER

Thanks JonFish85 for ur comments

I still have one more issue....which striked...

Suppose both are checked(If i check B then A should also get checked)and if i try to uncheck A then even B should also gets unchecked.

Can anyone post the comments/code.....

cheers
Try this

<html>
<body>
<form name=frmg>
<input type=checkbox name=chkA onclick="if(this.checked==false)document.frmg.chkB.checked=false">A
<input type=checkbox name=chkB onclick="document.frmg.chkA.checked=this.checked">B
</form>
</body>
</html>

rgds
jcs
If u want A to remain checked when u uncheck B, then here is the code. This will also do the one that u asked.

1) When u check B, A will also get checked
2) When u uncheck A, B will also get unchecked
3) A can be independently checked and unchecked
4) When u uncheck B, A will remain checked

<html>
<body>
<form name=frmg>
<input type=checkbox name=chkA onclick="if(this.checked==false)document.frmg.chkB.checked=false">A
<input type=checkbox name=chkB onclick="if(this.checked==true)document.frmg.chkA.checked=this.checked">B
</form>
</body>
</html>

rgds
jcs
o.k.,
maybe a summation of the info:

basicly a checkbox input field has a .checked property which is a boolean.
this property can be tested at any time to determine wather the checkbox is checked or not.
the same property can be used to check or uncheck the input by assigning it a value of true or false respectively.

by setting a name attribute to the checkbox's input tag you can refer to it by code outside its own events (where it can be refered to as "this".

the value a checkbox has in its onclick event is the value that the click action changed it to be.

depending on the logic you want to implement you could either
1) have small compact inline event handlers for each checkbox

e.g.
<form name=frmg>
<input type=checkbox name=chkA onclick='if (!this.checked) {document.frmg.chkB.checked=false}>A
<input type=checkbox name=chkB onclick='if (this.checked) {document.frmg.chkA.checked=true}'>B
</form>


2) have more complex event handlers in different functions for each checkbox

<script language="javascript">
   function AClicked(){
     if (!(chkA.checked) && chkB.checked ) {
        chkB.checked=false;
     }
   }
   function BClicked(){
     if (!(chkA.checked) && chkB.checked ) {
        chkA.checked=true;
     }
   }
</script>
<form name=frmg>
<input type=checkbox name=chkA onclick="AClicked();">A
<input type=checkbox name=chkB onclick="BClicked();">B
</form>

this could also be  written as

<script language="javascript">
   function AClicked(){
     if (!(chkA.checked)) {
        chkB.checked=false;
     }
   }
   function BClicked(){
     if (chkB.checked ) {
        chkA.checked=true;
     }
   }
</script>
<form name=frmg>
<input type=checkbox name=chkA onclick="AClicked();">A
<input type=checkbox name=chkB onclick="BClicked();">B
</form>

which is shorter code but sets the checked property of the "other" control even when its allready set to the desired value.



3) have a single event handler that recieves the clicked element and responds acordingly.

<script language="javascript">
   function SetSeconLikeFirst(control1,control2,val){
     if (control1.checked == val) {
        control2.checked = val;
     }
   }
</script>
<form name=frmg>
<input type=checkbox name=chkA onclick="SetSeconLikeFirst(chkA,chkB,false)">A
<input type=checkbox name=chkB onclick="SetSeconLikeFirst(chkB,chkA,true);">B
</form>


which one should you actually use, well that depends on your actual needs.

I belive this would put some order into things, and maybe give you some tools for the future.

if not, just let us know what else is not clear or required.

SnowFlake.



Try this out

<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT language=javascript>
function check()
{
 if (f1.c2.checked)
 {
   f1.c1.checked = true;
 }
}
</SCRIPT>
</HEAD>
<BODY>
<form name=f1>
<INPUT type=checkbox name=c1>A<BR>
<INPUT type=checkbox name=c2 onclick="check()">B
</form>
</BODY>
</HTML>
my code literally exactly snehalkgandhi. You shouldnt post an answer where your answer is exactly the same as several other comments. Let the questionerre figure out the correct answer.

bangviz: I would suggest you reject the answer proposed here, and award someone else the points, who has helped you.
we shall wait and see

rgds
jcs
Please don't hesitate to reject an answer and accept a comment :)

rgds
jcs
jcs et al

"by setting a name attribute to the checkbox's input tag you can refer to it by code outside its own events (where it can be refered to as "this"."

If we add the fact that each element has access to the form it is in using "this.form" then we can change

onclick='if (!this.checked) {document.frmg....
to
onclick='if (!this.checked) {this.form....


snehalkgandhi: Welcome to EE, please read what it says at the bottom of the page and refrain from answering questions that has comments - especially with answers that are the same as already posted

Michel
So to refrase Nilapenns comment which seem to be the simplest and most correct according to what I read

<form>
<input type="checkbox" name="chkA">A
<input type="checkbox" name="chkB"
onClick="this.form.chkA.checked=this.checked">B
</form>

Michel
PS: No points for me - I just try to clean the code up ;-)
Ok so is this ok mike ?

<html>
<head>
</head>
<body>
<body>
<form name=frmg>
<input type=checkbox name=chkA onclick="if(!this.checked)this.form.chkB.checked=false">A
<input type=checkbox name=chkB onclick="if(this.checked)this.form.chkA.checked=this.checked">B
</form>
</body>
</html>


rgds
jcs
Rule 1: If i check B then A should also get checked....
Rule2: But if i check A, B shouldn't get checked untill u force it to check....
Rule3 (I misread): if i try to uncheck A then even B should also gets unchecked.
Rule4 is missing - what happens to A if B gets UNCHECKED
I would think that
unchecking B would also uncheck A
Unchecking A would uncheck B
Checking A would not matter
Checking B would check A too

So
<form>
<input type="checkbox" name="chkA"
onClick="if (!this.checked) this.form.chkB.checked=false">B>A
<input type="checkbox" name="chkB"
onClick="this.form.chkA.checked=this.checked">B
</form>

I think we have had all permutations now

Michel

PS Experts, please do not try to gather points by being the last posting the most code or longest comments - that looks so desperate.
Bngviz: Please be advised that Customer Services can help you split points between experts
Well mike, this code which you have, seems to be the same as mine and I guess I was short in explaining my point.

rgds
jcs
No it is not.

I have
<input type="checkbox" name="chkB" onClick="this.form.chkA.checked=this.checked">B
and you have
<input type=checkbox name=chkB onclick="if(this.checked)this.form.chkA.checked=this.checked">B

You only uncheck.

Michel (not mike)
bangviz,
please do not abandon this Q,
if someones answer/comment helped you you should
accept thair answer/comment.
if not please supply more info as to what is still missing.

if you feel that there are several experts that should get point for thair assistance with this Q,
you can post a request to the community support.

SnowFlake.
This question remains LOCKED with a proposed answer.  If it served you, please accept it to grade and close this.  If it did not, please reject it and add comments as to why and what more is needed.  This question is quite old and needs your attention. If you need help to split points, or for other special handling needs, just comment here with details and I'll return when I can to help further.

You can always check all your open questions here by double clicking your Member Profile and expanding the VIEW question history button to navigate through them and update/finalize them.

The HELP DESK link on the left helps in these regards and includes the site's Guidelines, Member Agreement and the Question/Answer process.

Expert input is always welcome, in case we need to determine the fair outcome of this question.

Thanks,

Moondancer
Community Support Moderator @ Experts Exchange
The proposed answer should NOT be accepted. it is identical to a proposed non-complete comment

Michel
Thanks, Michel.  Rejected that.

Is there a complete answer here so I can award and close this?

Thanks,

Moondancer
Community Support Moderator @ Experts Exchange
bangviz--->  These are you open questions, please update and finalize them as quickly as possible.  If more is needed, let the experts know, if you've been helped please accept the expert comment that helped you to grade and close it.  Administration will be contacting you by Email about your lack of responsiveness to the experts who so willingly help you.  Your account has been escalated.

Experts, please let me know if this is still open in one week, and advise me how to close this ..... Award, PAQ at zero points or Delete.  Thanks in advance.

OPEN AND REQUIRE UPDATES/CLOSURE:

https://www.experts-exchange.com/jsp/qShow.jsp?ta=javascript&qid=20091168 - MARCH, 2001
https://www.experts-exchange.com/jsp/qShow.jsp?ta=javascript&qid=20123325
https://www.experts-exchange.com/jsp/qShow.jsp?ta=javascript&qid=20139009
https://www.experts-exchange.com/jsp/qShow.jsp?ta=dbgen&qid=20067491 JANUARY, 2001
https://www.experts-exchange.com/jsp/qShow.jsp?ta=java&qid=20142040
https://www.experts-exchange.com/jsp/qShow.jsp?ta=java&qid=20139228
https://www.experts-exchange.com/jsp/qShow.jsp?ta=java&qid=20139036
https://www.experts-exchange.com/jsp/qShow.jsp?ta=java&qid=20125377

Thank you,

Moondancer
Community Support Moderator @ Experts Exchange
Since good answers have been given I see no reason to Delete.
i would give everyone that contributed something to the answer some points.
Here is the one to PAQ in my opinion


<form>
<input type="checkbox" name="chkA"
onClick="if (!this.checked) this.form.chkB.checked=false">B>A
<input type="checkbox" name="chkB"
onClick="this.form.chkA.checked=this.checked">B
</form>
bangviz logged in 2/17/02 AFTER the request to update and finalize and chose to ignore this.

I apologize for asking you for yet more guidance, and really want to do what is 1) right and 2) fair for all contributors here.  

If a point split is done, based on merit, can you agree on this for me please?  

Sorry to ask, but hundreds of these in my inbox and appreciate the guidance.

EE Moderator
split between JonFish85, jcs_clement,SnowFlake and me
75 points each

Michel
Thanks a ton, this has been done:

Points for mplungjan   -> qid=20269632
Points for SnowFlake   -> qid=20269635
Points for jcs_clement -> qid=20269636

Moondancer
EE Moderator