Jump to content

checkbox

vj5

By vj5
in JavaScript

Recommended Posts

vj5 Member

vj5

Posted
Posted

I am working on a search page and i have a check all button to search for all the sublist and i have a list which can be individually checkmarked to search. It works fine. The problem is when i checkbox the sublist, check all box is also checked, each time I have to uncheck the box. How can I uncheck the checkall box, when I select the sublist?For example:check all button -default checkedone check boxtwo check boxthree check boxWhen I select one check box, I want the check all button to automatically uncheck.

Link to comment
Share on other sites
vj5 Member

vj5

Posted
  • Author
Posted
I am working on a search page and i have a check all button to search for all the sublist and i have a list which can be individually checkmarked to search. It works fine. The problem is when i checkbox the sublist, check all box is also checked, each time I have to uncheck the box. How can I uncheck the checkall box, when I select the sublist?For example:check all button -default checkedone check boxtwo check boxthree check boxWhen I select one check box, I want the check all button to automatically uncheck.
If you don't mind, could you please give an example:
Link to comment
Share on other sites
vj5 Member

vj5

Posted
  • Author
Posted
You need to have an onclick event on each checkbox to uncheck the other box. Check the Javascript tutorial on the site to see about onclick events and checkbox objects.
Here is my code:
<html><head><script LANGUAGE="JavaScript">function DoTheCheck() {if(document.frmlib.car_ae.checked == true) then	(document.frmlib.car_a == false)if(document.frmlib.car_ai.checked == true) then	(document.frmlib.car_ai == false)If(document.frmlib.car_a.checked == true) then	(document.frmlib.car_am == false)  }</script></head><body><form name=frmlib ><input type="checkbox" name="car_a" value="1" checked>All carrier and Resources<br /><br /><input type="checkbox" name="car_ae" value="1">car_A<br /><input type="checkbox" name="car_ai" value="1">Car_AI<Br /><input type="checkbox" name="car_am" value="1">Car_Ameri<br /><br /><input type="submit" value="search" onClick="DoTheCheck()" /><input type="Reset" /></form></body></html>

Above code unchecks the individual checkboxes but dont uncheck the All carrier and resourses....

Link to comment
Share on other sites
justsomeguy w3schools Guru

justsomeguy

Posted
Posted 
<script type="text/javascript">function uncheck_all(){  document.getElementById("allbox").checked = false;}</script><body><input type="checkbox" name="car_a" value="1" id="allbox" checked>All carrier and Resources<br /><br /><input type="checkbox" name="car_ae" value="1" onclick="uncheck_all()">car_A<br />

Link to comment
Share on other sites
vj5 Member

vj5

Posted
  • Author
Posted 
<script type="text/javascript">function uncheck_all(){  document.getElementById("allbox").checked = false;}</script><body><input type="checkbox" name="car_a" value="1" id="allbox" checked>All carrier and Resources<br /><br /><input type="checkbox" name="car_ae" value="1" onclick="uncheck_all()">car_A<br />

Thank you. It works perfectly. Is there a way to select all checkboxs if the user want to click on All carrier and Resources...
Link to comment
Share on other sites
justsomeguy w3schools Guru

justsomeguy

Posted
Posted

There are several ways. They all use the same type of statement like in that function to set the checked property of the checkbox to check. You can either hard code the list of checkboxes to check or create a loop to loop through all of them.

Link to comment
Share on other sites
vj5 Member

vj5

Posted
  • Author
Posted
There are several ways. They all use the same type of statement like in that function to set the checked property of the checkbox to check. You can either hard code the list of checkboxes to check or create a loop to loop through all of them.
How do I write another function in the input statement such as:
<input type="checkbox" name="car_ae" value="1" onclick="uncheck_all();check_all()">Car_AE<br>

Link to comment
Share on other sites
jesh Devoted Member

jesh

Posted
Posted

One way, like justsomeguy suggested, would be to do it in a loop:

function check_all(){	for(var i = 0; i < document.frmlib.elements.length; i++)	{		if(document.frmlib.elements[i].type == "checkbox")		{			document.frmlib.elements[i].checked = true;		}	}}

Link to comment
Share on other sites
vj5 Member

vj5

Posted
  • Author
Posted
One way, like justsomeguy suggested, would be to do it in a loop:
function check_all(){	for(var i = 0; i < document.frmlib.elements.length; i++)	{		if(document.frmlib.elements[i].type == "checkbox")		{			document.frmlib.elements[i].checked = true;		}	}}

Thank you. Just one more function. Now when I select sublist, All carriers is unselected. How do I do vice versa? when I select All carriers , the sublist should be unselected.....
Link to comment
Share on other sites
clonetrooper9494 Member

clonetrooper9494

Posted
Posted

I don't know what you mean, but if you want check box 1 to be unchecked when 2 is checked, then I have a page you should visit... (ignore the text on the site, it was for a freind) but when you check one, it unchecks the rest in that row... it is pretty long though...http://free.hostultra.com/~clonetrooper/he...bags/index.html(oops, those are radio's... same concept though!) Try viewing the source. I would suggest only using it if you have like 4 different radio's/checkboxes or more though, the script can get super long but it works!

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...