Dealing with checkboxes selection issue

[Jack_Tauson_Sr]

I have the following code:

<div>
      <div><label>Update Tiers:</label></div>
               <div>
                  <label><input id="tierIPrefixCheckboxSelected1" name="tierIPrefixCheckboxSelected" type="checkbox" value=""><input type="hidden" name="_tierIPrefixCheckboxSelected" value="">Tier-I</label>
                  <label><input id="tierIIPrefixCheckboxSelected1" name="tierIIPrefixCheckboxSelected" type="checkbox" value=""><input type="hidden" name="_tierIIPrefixCheckboxSelected" value="">Tier-II</label>
                  <label><input id="tierIIIPrefixCheckboxSelected1" name="tierIIIPrefixCheckboxSelected" type="checkbox" value="true" checked="checked"><input type="hidden" name="_tierIIIPrefixCheckboxSelected" value="">Tier-III</label>
               </div>
            </div>
         </div>
      </div>

The above code has third label checked(third checkbox) when an item from the dropdown list is selected.

The whole thing is inside an onchange function (details not shown) as shown below:

$("#availablePrefixes").change(function () {

//On change - just make sure all checkboxes have been unchecked
             $('input:checkbox[name=tierIPrefixCheckboxSelected]').attr('checked',false);
             $('input:checkbox[name=tierIPrefixCheckboxSelected]').val("");
           
            $('input:checkbox[name=tierIIPrefixCheckboxSelected]').attr('checked',false)
             $('input:checkbox[name=tierIIPrefixCheckboxSelected]').val("");

            $('input:checkbox[name=tierIIIPrefixCheckboxSelected]').attr('checked',false);
            $('input:checkbox[name=tierIIIPrefixCheckboxSelected]').val("");
            
            
            	$('input:checkbox[name=tierIPrefixCheckboxSelected]').change(function(){
        		
        			
        			console.log("Tier1 Prefix checkbox checked");
        			$('input:checkbox[name=tierIPrefixCheckboxSelected]').val(true);
        		    $('input:checkbox[name=tierIPrefixCheckboxSelected]').attr('checked',true);
        			//Make Tier II and Tier III false and uncheck
        			$('input:checkbox[name=tierIIPrefixCheckboxSelected]').val("");
        		    $('input:checkbox[name=tierIIPrefixCheckboxSelected]').attr('checked',false); 
        			
        		    $('input:checkbox[name=tierIIIPrefixCheckboxSelected]').val("");
        		    $('input:checkbox[name=tierIIIPrefixCheckboxSelected]').attr('checked',false); 
        			
        			
        		})
        		
        		$('input:checkbox[name=tierIIPrefixCheckboxSelected]').change(function(){
        		
        			
        			console.log("Tier 2 Prefix checkbox checked");
        			$('input:checkbox[name=tierIIPrefixCheckboxSelected]').val(true);
        			$('input:checkbox[name=tierIIPrefixCheckboxSelected]').attr('checked',true);
        			//Make Tier I and Tier III false and uncheck
        			$('input:checkbox[name=tierIPrefixCheckboxSelected]').val("");
        		    $('input:checkbox[name=tierIPrefixCheckboxSelected]').attr('checked',false);
        		    
        		    $('input:checkbox[name=tierIIIPrefixCheckboxSelected]').val("");
        		    $('input:checkbox[name=tierIIIPrefixCheckboxSelected]').attr('checked',false); 
        		    
        			
        		})
        		
        		$('input:checkbox[name=tierIIIPrefixCheckboxSelected]').change(function(){
        		
        			
        			console.log("Tier 3 Prefix checkbox checked");
        			$('input:checkbox[name=tierIIIPrefixCheckboxSelected]').val(true);
        			$('input:checkbox[name=tierIIIPrefixCheckboxSelected]').attr('checked',true);
        			
        			//Make Tier I and Tier II false and uncheck
        			
        			$('input:checkbox[name=tierIPrefixCheckboxSelected]').val("");
        		    $('input:checkbox[name=tierIPrefixCheckboxSelected]').attr('checked',false);
        		    
        			$('input:checkbox[name=tierIIPrefixCheckboxSelected]').val("");
        		    $('input:checkbox[name=tierIIPrefixCheckboxSelected]').attr('checked',false); 
        			
        			
        		})
            
            
});

The problem I am running into is (let’s say if I check mark Tier II checkbox, on the UI, the check box for Tier III will be unchecked as soon as I check marks Tier II check box.
However, when I am submitting the form, it is sending true for Tier II (which I want) as well as for Tier III (which I don’t want). Is there something I’m doing wrong in the above code?

[m_hutley]

You should just be able to say $(selector).each(function () { this.checked = false; } and it should work…

I’m doing all in my power not to optimize and streamline that code, but that’s not related to its functionality.