Reputation: 117
I have 3 Icheck control, if any of those is Toggled, will call one function event?, is that possible?
<div class="checkbox">
<label>
<input class="i-check" type="checkbox" id="IsZero" name="IsZero" />0
<span class="pull-right"></span>
</label>
</div>
<div class="checkbox">
<label>
<input class="i-check" type="checkbox" id="IsOne" name="IsOne" />1
<span class="pull-right"></span>
</label>
</div>
<div class="checkbox">
<label>
<input class=" i-check" type="checkbox" id="IsTwo" name="IsTwo" />2+
<span class="pull-right"></span>
</label>
</div>
That function event was for sorting: so if one is checked, then it will display values with one only, eg. if 1 or 2 is checked will display 1's and 2's.
i tried below code:
$('input:checkbox.i-check')
$('input.i-check').on('ifToggled'), function(event) {
}
but this doesn't trigger them., is there other way?
Upvotes: 0
Views: 136
Reputation: 8249
Here is how you can do this. Instead of console.log
, you can call your function:
$('input.i-check').on('click', function(){
if ( $(this).is(':checked') ) {
console.log('Checked');
}
else {
console.log('Unchecked');
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="checkbox">
<label>
<input class="i-check" type="checkbox" id="IsZero" name="IsZero" />0
<span class="pull-right"></span>
</label>
</div>
<div class="checkbox">
<label>
<input class="i-check" type="checkbox" id="IsOne" name="IsOne" />1
<span class="pull-right"></span>
</label>
</div>
<div class="checkbox">
<label>
<input class=" i-check" type="checkbox" id="IsTwo" name="IsTwo" />2+
<span class="pull-right"></span>
</label>
</div>
Upvotes: 1