How To Uncheck A Radio Button

[Darina]

Hello! I am looking for a way to disable a radio button. If I select one I can only switch to another one. I want to be able to leave all radio buttons blank. Is there any way to do that?

 

Thank you.

[asilverman66]

The trick is to set the checked property to false. Here's some javascript and jquery that should help (adapted from here):

 

var allRadios = document.getElementsByType('radio');
var booRadio = allRadios[0];
for(var x = 0; x < allRadios.length; x++){
   allRadios[x].onclick = function() {
      if(booRadio == this){
         if(this.checked) this.checked = false;
         booRadio = null;
      } else{
         booRadio = this;
      }
    };
}

[phenom94]

I tried the code above and it did not work. This worked for me. Add it to the footer:

<script>
var allRadios = document.getElementById("caspioform").elements;
var booRadio;
var x = 0;
for(x = 0; x < allRadios.length; x++){

        allRadios[x].onclick = function(){

            if(booRadio == this){
                this.checked = false;
        booRadio = null;
            }else{
            booRadio = this;
        }
        };
}
</script>

[Kurumi]

Hi - here is another way to call a radio button.

<script>

var allRadios = document.querySelectorAll('input[type="radio"]')
var booRadio;
for (var x = 0; x < allRadios.length; x++) {
  
  allRadios[x].onclick= function() {
    
    if (booRadio == this) {
      this.checked = false;
      booRadio = null;
    } else {
      booRadio = this;
    }
  };
}

</script>