Skip to content
Related Articles

Related Articles

Improve Article
How to specify that the user is required to select a value before submitting the form in HTML5 ?
  • Last Updated : 17 Mar, 2021

The purpose of this article is to specify that the user is required to select a value before submitting the form in HTML5. This will force the user to enter a value before a form is submitted.

The <select> required attribute can be used for this purpose. It is a boolean attribute that states an input field must be filled in before the form can be submitted. The text, URL, tel, email, password, date pickers, number, checkbox, radio, and file are supported by the required attribute.

Syntax:

<select name="" required>

The below example will demonstrate this approach:

Example 1:



HTML




<!DOCTYPE html>
<html>
  <body>
    <form method="post" 
          action="/">
      <h3>
        How to specify that the user is
        required to select a value before
        submitting the form in HTML5
      </h3>
  
      <select name="Language" required>
        <option value="">
          None
        </option>
        <option value="python">
          Python
        </option>
        <option value="cpp">
          Cpp
        </option>
        <option value="java">
          Java
        </option>
      </select>
      <input type="submit" />
    </form>
  </body>
</html>

Output: As we can see, we need to select the item in the list before submitting the form.

Example 2:

HTML




<!DOCTYPE html>
<html>
  <body>
    <form method="post" action="/">
      <h3>
        How to specify that the user is required
        to select a value before
        submitting the form in HTML5
      </h3>
        
      <input type="checkbox" id="python"
             name="python" value="language"
             required/>
      <label for="vehicle1"> Python</label>
      <br />
      <input type="checkbox" id="cpp" name="cpp"
             value="language" required/>
      <label for="vehicle2"> Cpp</label>
      <br />
      <input type="checkbox" id="java" name="java"
             value="language" required/>
      <label for="vehicle3"> Java</label>
      <br />
      <input type="submit" />
    </form>
  </body>
</html>

Output: As we can see, we need to select the check the checkbox before submitting the form.

Checkbox Element




My Personal Notes arrow_drop_up
Recommended Articles
Page :