CODEWITHSUNDEEP
javascriptjqueryjquery-plugins
Alvaro
Alvaro

Reputation: 41605

Detect checkbox status of iOS Checkboxes plugin

I am using this plugin to give checkboxes and iOS look and feel: http://ios-checkboxes.awardwinningfjords.com/

Apparently, it doesn't touch the hidden checkbox input value when I use Chrome or Firefox DOM inspector. It always remains the same although it works perfectly after submiting the form detecting the defined state. (I don't know how it does it...)

Currently I am using some input selects and depending on the value (yes or no) it shows another element:

Html:

<select name="announcement" id="announcement">
    <option value="0">No</option> 
    <option value="1">Yes</option>
</select>

jQuery change detection:

$('#announcement').change(function(){
    if($(this).val() == 0 ){
        $('#listOfCompanies').show();
    }else{
        $('#listOfCompanies').hide();
    }
});

Now, i converted the first select into a checkbox like this:

<input type="checkbox" name="announcement" value="1" id="announcement">

Is there any way I could detect the checkbox value when I use iOS plugin?

$('#announcement').change(function(){ doesn't work as the checkbox value doesn't change anymore in the DOM element.

Upvotes: 0

Views: 753

Answers (1)

wirey00
wirey00

Reputation: 33661

If you look at the jquery-demo html that comes with the download, it shows an example of how to bind the onchange event handler.

$('#announcement').iphoneStyle({
    onChange: function(elem, value) { 
      // not sure what comes up as the arguments passed in.. but to find out you can do console.log(arguments)
      $('#listOfCompanies').toggle(!value);
    }
});

EDIT:

Try passing your checked/unchecked label options at the same time

$('#announcement').iphoneStyle({
    checkedLabel: 'your checked label',
    uncheckedLabel: 'your unchecked label',
    onChange: function(elem, value) { 
      // not sure what comes up as the arguments passed in.. but to find out you can do console.log(arguments)
      $('#listOfCompanies').toggle(!value);
    }
});

Upvotes: 1

Related Questions