jQuery or JavaScript for a onclick event not being triggered

Question

Hi,

I'm working on a ASP.net web app, and encountered a jQuery or JavaScript issue. The problem is: I want to do this - when a button is clicked, trigger a javascript function to do a certain task, but for some reason this particular function is not being called, no matter how I try it.

I have tried to use jQuery and Javascript function, but none worked. There are other jQuery and Javascript functions on this page - I have commented out everyone of them, to see which may be interfering with this particular function; but found that when any of other javascript function or jQuery is commented out, this function is still not called. No other javascript is causing this one to not being called.

I have run out of ideas, hope to get some help here. Appreciate it!

-Claudia

My HTML:

I have a form with many checkboxes that I can check or uncheck, then submit. For any unchecked checkbox, I want to assign its value to be 0, and mark it as checked, so that the values can be passed back to the controller logic - this is what the jquery is trying to do; as you will see below.

<input type="checkbox" css="chkbox" name="PermGroupChecked[0][1][0]" value=1 checked="checked" />                                            

<input type="checkbox" css="chkbox" name="PermGroupChecked[0][1][1]" value=1 />
                                            
<input type="checkbox" css="chkbox" name="PermGroupChecked[0][1][2]" value=1 />
                                            

....

<button id="saveBtn" class="btn btn-primary marginTopExt25">Save</button>

My jQuery:

<script type="text/javascript">
    //$(window).load(function () {
     $(document).ready(function () {
        //$(".btn").click(function () {
        //$('.btn').on("click", function () {
        $("#saveBtn").click(function () {
            $('.chkbox').each(function () {
                if ($(this).prop('checked') != true) {
                    $(this).val(0);
                    $(this).prop('checked', true);
                    alert("got here " + $(this).val());
                }
            });
        });
    });
</script>

I also tried this:

<script type="text/javascript">
    $(document).ready(function () {
        $("#saveBtn").on("click", chkboxVal);
        
        function chkboxVal() {
            var checkboxes = document.getElementsByName("PermGroupChecked");
            // loop over them all
            for (var i = 0; i < checkboxes.length; i++) {
                if (!checkboxes[i].checked) {
                    checkboxes[i].val(0);
                    checkboxes[i].checked = true;
                }
            }
        }
    });
</script>