The HTML Required attribute is a Boolean attribute which specifies that the input element must be filled out before the submission of form. This attribute used with the following elements:
- <input>
- <select>
- <textarea>
<input>
The required attribute can be effortlessly applied to the <input> element by following this syntax:
Example
<input required>
Example
Example
<html>
<head>
<title>
Example of required attribute with input element
</title>
<style>
div
{
padding: 10px 0;
}
</style>
<head>
<body>
<form>
<div>
<label>Name</label>
<input type="text" placeholder="Enter Name" name="name" required>
</div>
<div>
<label> E-mail </label>
<input type="email" placeholder="Enter email ID" name="email" required>
</div>
<div>
<label> Mobile No. </label>
<input type="text" placeholder="Enter Your Mobile No." name="mobileno" required>
</div>
<div>
<label>Password</label>
<input type="password" placeholder="Enter Password" name="psw" required>
<br>
</div>
<button type="submit" VALUE="SUBMIT"> SUBMIT </button>
</form>
</body>
</html>
Output:
### Required Attributes
Utilizing the essential attribute with the specified <select> element can be achieved effortlessly by following this syntax:
Example
<select required>
Example
Example
<html>
<head>
<title> Example of required attribute with select option </title>
<style>
div
{
padding: 10px 0;
}
</style>
<head>
<body>
<form>
<label>
Course :
</label>
<select required>
<option value="">None</option>
<option value="BCA">BCA</option>
<option value="BBA">BBA</option>
<option value="B.Tech">B.Tech</option>
<option value="MBA">MBA</option>
<option value="MCA">MCA</option>
<option value="M.Tech">M.Tech</option>
</select>
<button type="submit" VALUE="SUBMIT"> SUBMIT </button>
</form>
</body>
</html>
Output:
### Required Attribute
The required attribute can be effortlessly applied to the <textarea> element using the syntax demonstrated below:
Example
<textarea required>
Example
Example
<html>
<head>
<title> Example of required attribute with textarea </title>
<style>
div
{
padding: 10px 0;
}
</style>
<head>
<body>
<form>
Any Comment :
<br>
<textarea cols="80" rows="5" placeholder="Enter a comment" value="address" required>
</textarea>
<button type="submit" VALUE="SUBMIT"> SUBMIT </button>
</form>
</body>
</html>
Output:
Browser Support
| Element | Chrome | IE | Firefox | Opera | Safari |
|---|---|---|---|---|---|
<required> |
Yes | Yes | Yes | Yes | Yes |