I want to programmatically check a checkbox and trigger the checkbox's onchange function
I have tried ("#myCheckbox").click() but it only checks it and does not call its onchange function
How can I get the onchange function to execute as well?
edit:
When the document is ready i need the checkbox checked and its on change function called programatically.
Your change listener needs to be set before you trigger the click on the checkbox. The following code works with no issues:
$("#myCheckbox").on('change', function(){
console.log('Change');
}).click();
How about something like this:
$('#myCheckbox').prop({ checked: true });
theOnchangeFunction();
$('#myCheckbox').on('change', theOnchangeFunction);
function theOnchangeFunction(){
}
prop call. I didn't know about that!
.css() is another common use case, since you usually want to pass more than one property.css, but not in this way. Thanks for the eye-opener :)you can try like below
$("#scheck").attr('checked', 'checked').change();
it will check the check box as well trigger onchange event for checkbox
ex:
Script :
$(document).ready(function () {
$("#scheck").attr('checked', 'checked').change();
});
function checkitout() {
alert("onchange event fired");
}
HTML :
<input type="checkbox" name="tdcheck" id="scheck" onchange="checkitout();" />
Don't understand, it works : http://jsfiddle.net/FW5Lp/
<input type="checkbox" id="myc">
<button id='clic'>click</button>
$('#myc').on('change', function(){alert('ca change');});
$('#clic').on('click', function(){$('#myc').trigger('click') });
Try both events by using on() like,
("#myCheckbox").on('click change',function(e){
alert(e.type);
})
onchangefunction defined? As an HTML attribute?