Click here to Skip to main content
15,888,461 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
My HTML

XML
<input id="Alloption" type="checkbox"  checked="checked" value="All" style=" color: Black" class="chkdisplay"/><span style=" color: Black" >All </span><br />
                               <input id="Checkbox2" type="checkbox"  value="Accepted"  style=" color: Black"  class="chkdisplay" /><span style=" color: Black" >Accepted </span><br />
                               <input id="Checkbox3" type="checkbox" value="Contracted" style=" color: Black" class="chkdisplay"/><span style=" color: Black" >Contracted</span><br />
                               <input id="Checkbox4" type="checkbox"  value="Pending" style=" color: Black" class="chkdisplay"/><span style=" color: Black" >Pending</span><br />
                               <input id="Checkbox5" type="checkbox"  value="Pre-Authorized" style=" color: Black" class="chkdisplay"/><span style=" color: Black" >Pre-Authorized</span><br />
                               <input id="Checkbox6" type="checkbox"  value="Show Deleted" style=" color: Black" class="chkdisplay"/><span style=" color: Black" >Show Deleted</span><br />
                               <input id="Checkbox7" type="checkbox"  value="Treated" style=" color: Black" class="chkdisplay"/><span style=" color: Black" >Treated</span><br />


Script i used(not working)
$('.chkdisplay').on('change blur', function () {
$('#Alloption').prop('checked', !($('.chkdisplay').not(':checked').length));
});

I want to iterate the checkboxes from 1 to 7 and if any of this checkbox is checked the uncheck checkbox with id="All"
Posted
Updated 31-May-13 18:21pm
v2
Comments
Not clear. Please explain again.

1 solution

Add an common change event handler to all 7 checkboxes, check if any of the checkboxes are checked
HTML
<input id="Checkbox2" type="checkbox"  value="Accepted"  style=" color: Black"  class="chkdisplay" onchange="toggleAllCb(this)" /><span style=" color: Black" >Accepted </span><br />
                               <input id="Checkbox3" type="checkbox" value="Contracted" style=" color: Black" class="chkdisplay" onchange="toggleAllCb(this)"/><span style=" color: Black" >Contracted</span><br />
                               <input id="Checkbox4" type="checkbox"  value="Pending" style=" color: Black" class="chkdisplay" onchange="toggleAllCb(this)"/><span style=" color: Black" >Pending</span><br />
                               <input id="Checkbox5" type="checkbox"  value="Pre-Authorized" style=" color: Black" class="chkdisplay" onchange="toggleAllCb(this)"/><span style=" color: Black" >Pre-Authorized</span><br />
                               <input id="Checkbox6" type="checkbox"  value="Show Deleted" style=" color: Black" class="chkdisplay" onchange="toggleAllCb(this)"/><span style=" color: Black" >Show Deleted</span><br />
                               <input id="Checkbox7" type="checkbox"  value="Treated" style=" color: Black" class="chkdisplay" onchange="toggleAllCb(this)"/><span style=" color: Black" >Treated</span><br />


And in your script
JavaScript
function toggleAllCb(sender)
{
   if($("#Alloption").checked) {
      if(sender.checked)
         $("#Alloption").checked = false;
    }
}
 
Share this answer
 
v3
Comments
Somnath Leo 1-Jun-13 5:05am    
@ Amitosh Swain1 your code is not working see link http://jsfiddle.net/kp3rb/
AlphaDeltaTheta 1-Jun-13 5:36am    
Check now...
AlphaDeltaTheta 1-Jun-13 5:16am    
Oh... I wrote the Alloption, I kept that on you do to $(#Alloption)

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS


CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900