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 ..

Athul, the code is perfectly fine and must work as expected, Do you see any errors in your console?? — Rajshekar Reddy, Mar 02 '16 at 03:07
Did you try by give a simple alert to check your jquery working in this page ? — Alimon Karim, Mar 02 '16 at 03:07
@AlimonKarim yes i did and jquery is working perfectly ... other functions are there which are working too — apr, Mar 02 '16 at 03:36
I guess there can be another checkbox and some HTML which might cause issues, Can you post your complete code. Or you yourself can create a JSFiddle and you will be able to find out the issue. — Rajshekar Reddy, Mar 02 '16 at 03:41

score 2 · Accepted Answer · answered Mar 02 '16 at 05:08

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

score 0 · Answer 2 · edited May 23 '17 at 10:28

0

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.

edited May 23 '17 at 10:28

Community

1
1

answered Mar 02 '16 at 02:44

Wistar

3,770
4
45
70

so how does this solve his problem? what was his problem? – Rajshekar Reddy Mar 02 '16 at 02:50
@Wistar yes jquery is working fine and i also tried out everything in your answer .. but still the function is not triggering , there are many other functions on the same page that are working perfectly ... when it comes to checkbox i'm facing this problem – apr Mar 02 '16 at 02:57

score 0 · Answer 3 · answered Mar 02 '16 at 03:04

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

checkbox change event not working

3 Answers3