alomegah
alomegah

Reputation: 117

3 Icheck Control for one event function

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

Answers (1)

Milan Chheda
Milan Chheda

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

Related Questions