I used "iCheck jQuery" to modificate the style of the checkbox. But when i add a iCheck script - my onlick metod stops working. Why it happening?
<input id="my_cb" type="checkbox" value="yes_n" onclick="hide_row_metod()"/>
<script>
$(document).ready(function(){
$('#my_cb').iCheck({
checkboxClass: 'icheckbox_square-blue',
radioClass: 'iradio_square-blue',
increaseArea: '20%' // optional
});
});
</script>
My script:
<script>
function hide_row_metod() {
if(document.getElementById('my_cb').checked){
document.getElementById('row1').style.display = "none";
}else{
document.getElementById('row1').style.display = "inline";
}
}
</script>
iCheck
registers custom events you can listen for. I put up a working example on jsbin, the main difference is this:
$("#my_cb").on("ifChanged", hide_row_metod);
There are two events: ifChecked
and ifUnchecked
. If you want to catch all changes to your checkbox, you need to either listen for both or simply listen for ifChanged
. This will work to toggle the row, as you are testing for checked
in your hide_row_metod
.
In my example, I use a block element div#row1
, so it will render differently (inline
) after checking and unchecking.
Also: you got a typo in your method name (missing h
).