Html checkBox onchange not working

Question

<input class="jProblemClass" id="Checkbox{%= ID %}" type="checkbox" onchange="problemPicker.onChangeProblemCheckBox('{%=ID %}');"/> 

After the first check or uncheck, nothing happens. Afetr second click, call my functionPicker.onChangeProblemCheckBox function, but I will get the ID of the first check. What for? Can I help you?

 onChangeProblemCheckBox: function(id) { if ($('#CheckBox' + id).attr("checked") == true) { problemPicker.addToCheckProblems(id); var checkboxes = $('.jProblemClass:checked'); if ((checkboxes.length > general.limit) && (general.limit != 0)) { alert('The limit of ' + general.limit + ' problems exceeded. Please deselect ' + (checkboxes.length - general.limit).toString() + '.'); } } else { problemPicker.delFromCheckProblems(id); } }, 

Answer 1

Use onclick in the browser instead of onchange .. Reason ... According to the Javascript recommendations I read, onchange fires after the focus is lost. Unless you click elsewhere, focus will not be lost in IE. Other browsers should not wait until the focus is lost firing onchange - which suggests that they do not follow the specification correctly (despite the fact that in this regard it makes more sense to shoot). How about using onclick and onkeydown / onkeyup (using both onclick and onkeyup / onkeydown you cover both the mouse and keyboard checkbox settings). LINK: http://www.winvistatips.com/re-onchange-event-checkbox-not-working-properly-t311364.html

Answer 2

I think the problem comes from here: $('#CheckBox' + id).attr("checked") == true . According to the HTML specifications, checked must be set to "checked" when this event fires. So, try using something like $('#CheckBox' + id).attr("checked") == "checked" or even $('#CheckBox' + id).attr("checked") .

As a second option, I recommend using pure jquery to run your program. For example, if you have a flag <input type="checkbox" id="ac"> , you can use this jq code to process your routines:

 $(document).ready(function() { $("input[type=checkbox]").change(function() { alert("Am i checked? - " + $(this).attr("checked") + "\nMy ID:" + $(this).attr("id")); }); }); 

This case is shown in this demo .

Answer 3

Try using if($('#CheckBox' + id + ':checked').length > 0) instead, so you tell jQuery whether the check box is checked or not.

Also, if onChangeProblemCheckBox uses any internal properties in problemPicker , but does not refer to them with the full path, i.e. problemPicker.nnnnn it will not work, since the event will fire in the context of the element, not the Picker problem. It would be as if the function was called like this $('#CheckBox' + id).onChangeProblemCheckBox() .