checkbox change event not working

Question

i'm Trying to include an onclick event for a checkbox in my laravel application

This is my Input Section

<input type="checkbox" id="early_access" name="early_access">

And the function

$(document).ready(function() {
  $('#early_access').change(function() {
    alert("booyah");
  });
});

The function is not working ..

Answer 1

Guys i found the problem and solved it Unfortunately the frontend designer had some other function running for changing the style of checkbox and it was inherited from the master layout ...

$(document).ready(function(){
$('input').iCheck({
    checkboxClass: 'icheckbox_flat-blue',
    radioClass: 'iradio_flat-blue'
});
});

this was running instead of my script :( .. when i removed it everything worked

Answer 2

Have you checked if your jquery was loaded ?

window.onload = function() {
    if (window.jQuery) {  
        // jQuery is loaded  
        alert("Yeah!");
    } else {
        // jQuery is not loaded
        alert("Doesn't Work");
    }
}

Use on

$(document).ready(function() {
    $('#early_access').on("change", function() {
        alert("booyah");
    });
 });

If you can, I suggest that you use your selector #early_access as an argument.

$(document).ready(function() {
     $(document).on("change", "#early_access" function() {
         alert("booyah");
     });
});

It might not be relevant with an id but if you use a class based attribute and you dynamically change the DOM, it will still be responsive. But that might be beyond the point of your question.

Answer 3

Your code is absolutely fine see this fiddle https://jsfiddle.net/avinash8526/nL1crxn0/1/

 $(document).ready(function() {
  $('#early_access').change(function() {
    alert("I will only work with check uncheck");
  });
});

Further you have onchange event applied, hence this alert will only work if you check/uncheck this box