When using customized checbox (i.e., icheck v1.0.1 from the website http://icheck.fronteed.com/), i am not able to use the "onclick" and "onchange" functions that i create manually. I have to use the custom "ifClicked" and "ifChanged" functions that the plugin provides.
Here is my code:-
<!DOCTYPE html>
<html>
<head></head>
<body>
<div id="divchkBox">
<input type="checkbox" id="extEmailChk" name="custEmailChkBox" onchange="foo()"/><br />
</div>
<script>
function foo(){
alert("hi");
}
</script>
</body>
</html>
But the "foo" function doesn't get called. I have to use the custom "ifChanged" function.
<script>
$('#divchkBox input').on('ifClicked', function (event) {
alert("hi");
});
</script>
I have tried to add the "onclick","onchange" functions in many ways but nothing works.
Actually i need to show a confirm box at the click of the checkbox and depending on the confirmation value(i.e., whether the user clicks 'OK' or 'Cancel') toggle or retain the checkbox's checked state. But since i am using this plugin's custom callbacks, even though i set the checked property of the checkbox as checked/unchecked in the 'else' part(i.e., if i click 'Cancel' button) at the end of function call the checkbox's value gets altered instead of getting retained.
Here is the code i am using:-
$('#divchkBox input').on('ifClicked', function (event) {
var checkbox = document.getElementById("extEmailChk");
if (checkbox.checked) {
var result = confirm("Are you sure you DONT want to send email to customer?");
if (result) {
$('#extEmailChk').iCheck('uncheck');
}
else {
$('#extEmailChk').iCheck('check');
}
}
else {
var result = confirm("Are you sure you want to send email to customer?");
if (result) {
$('#extEmailChk').iCheck('check');
}
else {
$('#extEmailChk').iCheck('uncheck');
}
}
});
I am achieving the functionality i want when i am creating custom methods for the click and change
events of the checkbox, but not when i am using the icheck callbacks.
Please help...