选择单选按钮时，jQuery验证不起作用

Question

I have jQuery validation for my form. There is a radio box (attendance) and 2 drop down menus (colour and shade).

It works perfectly if the user logs in for the very first time. However because I have retreived the value from the database based on what they have selected before, if the user has already selected their choice and log back in, if they previously selected 'No' then my jQuery does not work. The two dropdown menus submit and are not greyed out as they should be. But if I click on 'No' radio box it does. Not sure if issue lies with jQuery or my radio button.

If the user logged in for the first time and selects 'No', they boxes grey out immediately.

jQuery validation:

<script src="jquery.js"></script>
 <script>      
    $( function(){    
            function validate(id){       
                var enabled = ($("input[name='attendance" + id + "']:checked").val() == 'Yes');         
                if(enabled){              
                    //Please select option is selected              
                    if($("#colour" + id)[0].selectedIndex == 0){                 
                    alert('Please make your colourselection');                  
                    return false;             
                    }              
                    //Please select option is selected              
                    if($("#shade" + id)[0].selectedIndex == 0){                  
                        alert('Please select your shade');                  
                        return false;             
                    }   
                }     
                return true;    
            };

            $("input[name^='attendance']").click(function() {  

                var id = this.name.replace('attendance', '');      
                $("#colour" + id + ", #shade" + id).prop("disabled", this.value == 'No');         
                validate(id);    
            });      
           $("input:submit").click(function(){         
               var retVal = true;
               $.each([1], function(i, val){
                  retVal = (validate(val) && retVal);
               });
                return retVal;   
           }); 
         }); 
  </script>

radio button:

<input name="attendance1" type="radio" id="Yes" value="Yes" checked="CHECKED" <?php if($row3['attendance1']=="Yes") { echo "checked"; }?>/>Attend with pleasure 
<br />
<input name="attendance1" type="radio" id="No" value="No" <?php if($row3['attendance1']=="No") { echo "checked"; }?>/>Decline with regret 

Answer 1

You are adding extra checked="checked" in Yes radio button, so it will always remain checked despite the value obtained from database, so try removing that, like,

<input name="attendance1" type="radio" id="Yes" value="Yes" <?php if($row3['attendance1']=="Yes") { echo "checked"; }?>/>Attend with pleasure 
<br />
<input name="attendance1" type="radio" id="No" value="No" <?php if($row3['attendance1']=="No") { echo "checked"; }?>/>Decline with regret 

Hope it helps

Answer 2

The problem I see is this part

checked="CHECKED" <?php if($row3['attendance1']=="Yes") { echo "checked"; }?>

This will render to the following if $row3['attendance1'] is "Yes"

checked="CHECKED" checked

So this will create problem. Remove checked="CHEKCED" part.