How do I uncheck the previous radio button after selecting another one?

Asked

Viewed 3,305 times

5

I have five radio button, of these five one is "marked", as I do to unmark the radio button that I clicked after clicking on another?

Example:

<fieldset>
  <legend>Selecione:</legend>
  <label>Morango:
   <input type="radio" id="A" checked/>
  </label>
  <label>Maracujá: 
   <input type="radio" id="B" />
  </label>
  <label>Melancia:
   <input type="radio" id="C" />
  </label>
  <label>Melão: 
    <input type="radio" id="D" />
  </label>
  <label>Mamão:
    <input type="radio" id="E" />
  </label>
</fieldset>

html form validation radiobutton
  • 2

    define the same name

  • 2

    after that, put your own answer ;)

  • 2

    for example: name="radio-btn"

  • 1

    @Murilogambôa Grateful for the tip! It was a detail that I didn’t know, now I understand that without defining the tag name the checked is for the entire collection radio.

  • A very similar question: https://answall.com/questions/418763/como-fa%C3%a7o-para-uncheck-o-radio-button-que-%C3%A9-connected-to-other-anterior-ap%C3%b3s-select

1 answer

5


If you define the content of the attribute name inputs in an identical way.
Ex: name="myGroup", by default you will have the desired behavior.

Goes below

<fieldset>
  <legend>Selecione:</legend>
  <label>Morango:
   <input type="radio" id="A" name="myGroup"/>
  </label>
  <label>Maracujá: 
   <input type="radio" id="B" name="myGroup" />
  </label>
  <label>Melancia:
   <input type="radio" id="C" name="myGroup" />
  </label>
  <label>Melão: 
    <input type="radio" id="D" name="myGroup" />
  </label>
  <label>Mamão:
    <input type="radio" id="E" name="myGroup" />
  </label>
</fieldset>

  • 1

    André Paulo, Thanks! Such a detail that I never stopped to think what really made the "checked" go to another radio button. And the worst thing that was a failure of my own, because it was working perfectly in a personal project, that I am developing. So I decided to remove the name, and started my race against time to find out what had gone wrong that everyone was getting selected. Tired of trying to understand I decided to ask. :D

Browser other questions tagged html form validation radiobutton

You are not signed in. Login or sign up in order to post.