Question

Please find the code below

$("#chkCopy").toggle(function () {
   copyDetails(); 
},
function () {
   emptyCopyDetails();
});

// functions which do not have any effect on the checkbox
function copyDetails() {

}

function emptyCopyDetails() {
}

The issue is that checkbox is not showing the checked state.

Demo

Thanks in advance

Answer 1

The .toggle() interrupts the check, since .toggle() actually calls e.preventDefault() on the click event underneath. Instead of that approach, I’d recommend something like this instead:

$("#chkCopy").change(function () {
  if(this.checked) {
    copyDetails();
  } else {
    emptyCopyDetails();
  }
});

Here’s an updated/working version of your demo with the above approach.