Mark the checkbox when submitting the form

Question

I'm not sure if this is a bug in jQuery when using the .click() function instead of the .change() function for the checkbox. It works well on jsfiddle 1 : http://jsfiddle.net/fadlisaad/tSgbZ/16/ , but not on the current page http://webcollect.viewscast.com/canonrepairmobile

You can test it with this sequence:

• Language> English
• Country> United Kingdom
• Click Continue
• Select any option and click Continue for the next 3 questions until you find the question "Before your product is repaired, what steps did you take to try to solve the problem?"
• try selecting the last option "None of the above" and click "Continue." While downloading to the next question, the flag is mysteriously uncontrolled, so if you look at the source on the next page, you will find <INPUT TYPE="Hidden" ID="__OUTP__ResolveWay_7" NAME="__OUTP__ResolveWay_7" VALUE=""> <INPUT TYPE="Hidden" ID="__OUTP__ResolveWay_7" NAME="__OUTP__ResolveWay_7" VALUE="1">
  
  It works great with other checkboxes. Can anyone understand why?

Answer 1

With this code:

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

You do this so that every time you click on the input, the checkbox is deactivated. Therefore, when you click the submit button (yes, this is also an input), it unchecks the box.

I believe you 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 will also satisfy this jQuery selector, as it is of type <input> and is not called ResolveWay_7. Therefore, when the Continue button is clicked, it will clear the check box.

Answer 3

Look at the bottom of the source code of the page where you’ll select “None of the above”.

 <script type="text/javascript"> /* <![CDATA[ */ $(document).ready(function() { $('#comment').hide(); $('#specify').click(function() { $('#comment').toggle(); $('textarea').val(''); }); $('input[name="ResolveWay_7"]').change(function() { $('input[name!="ResolveWay_7"]').removeAttr('checked'); $('textarea').val(''); $('#comment').hide(); }); $('input[name!="ResolveWay_7"]').click(function() { $('input[name="ResolveWay_7"]').removeAttr('checked'); }); }); /* ]]> */ </script> 

There are 2 places where it says:

 $('input[name="ResolveWay_7"]').removeAttr('checked'); 

Answer 4

check this:

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

when you click on any input except ResolveWay_7 , it clears its checked property ( ResolveWay_7 ), and the submit button (continued) is also an input, so clicking on it is cleared. You must remove the button from the selection, for example:

 $('input[name!="ResolveWay_7"]').not("input.myButton").click(.......);