How to require radio button selection in html5 form

31,243

Solution 1

You can use the property required as its a boolean attribute that solve ur problem. required="required"

Solution 2

Use required attribute.

<input name="staatus" type="radio" value="Missis" required>

Solution 3

You just need to set the required-attribute for one input of the radiogroup, but you can set it for all.

<form action="/Home/Sendtitle" method="post">
<p>
  Title*  <span>
    <span>
      <span>
        <input name="staatus" type="radio" value="Mister" autofocus required>&nbsp;
        <span>Mister</span>
      </span>
      <span>
        <input name="staatus" type="radio" value="Missis">&nbsp;
        <span>Missis</span>
      </span>
    </span>
  </span>
</p>

<p>
  <input type="submit" value="Send title" >
</p>

</form>
Share:
31,243
Andrus
Author by

Andrus

Updated on July 16, 2022

Comments

  • Andrus
    Andrus almost 2 years

    html 5 form contains two radio buttons. How to force user to select one radion button before submitting form ? I tried to use required but there is not radio button group, required shoult applited to group.

    <form action="/Home/Sendtitle" method="post">
    <p>
      Title*  <span>
        <span>
          <span>
            <input name="staatus" type="radio" value="Mister" autofocus>&nbsp;
            <span>Mister</span>
          </span>
          <span>
            <input name="staatus" type="radio" value="Missis">&nbsp;
            <span>Missis</span>
          </span>
        </span>
      </span>
    </p>
    
    <p>
      <input type="submit" value="Send title" >
    </p>
    
    </form>
    
  • Brad Kent
    Brad Kent about 8 years
    Anyone know the current state of browsers still implementing this incorrectly by requiring every radio option having the required attribute?
  • Madbreaks
    Madbreaks about 6 years
    Drop the ="required" part. From the HTML5 spec: "A number of attributes are boolean attributes. The presence of a boolean attribute on an element represents the true value, and the absence of the attribute represents the false value."