Checkbox uncheck when submit form

Question

I am not sure is this a bugs in jQuery when using .click() function instead of .change() function for checkbox. It's working well on jsfiddle 1: http://jsfiddle.net/fadlisaad/tSgbZ/16/ but not on the live page http://webcollect.viewscast.com/canonrepairmobile

You may test it with this sequence:

1. Language > English
2. Country > United Kingdom
3. Click 'Continue'
4. Choose any option and click 'Continue' for the next 3 question until you found question 'Prior to having your product repaired which steps did you take to try and resolve the problem?'
5. try to choose the last option 'None of the above' and click continue. During the loading to the next question, the checked option is mysteriously unchecked itself, so if you view the source on the next page, you will find <INPUT TYPE="Hidden" ID="__OUTP__ResolveWay_7" NAME="__OUTP__ResolveWay_7" VALUE=""> which should be <INPUT TYPE="Hidden" ID="__OUTP__ResolveWay_7" NAME="__OUTP__ResolveWay_7" VALUE="1">
   
   It's just working fine with the others checkboxes. Could someone figure it out why?

Answer 1

With this code:

$('input[name!="ResolveWay_7"]').click(function() {
    $('input[name="ResolveWay_7"]').removeAttr('checked');
});

you make it so that each time there's a click on an input, the checkbox is deactivated. So when you click on the submit button (yes, that's also an input) it unchecks the checkbox.

I believe you only need to change the selector to $('input[type="checkbox"][name!="ResolveWay_7"]') and it should work.

Answer 2

The problem is this piece of code:

$('input[name!="ResolveWay_7"]').click(function() {
    $('input[name="ResolveWay_7"]').removeAttr('checked');
});

Your Continue button is also going to satisfy that jQuery selector as it is of type <input> and is not called ResolveWay_7. Therefore when the Continue button is clicked, it will deselect the checkbox.