Bootstrap 5 Validation Supported Elements

Bootstrap 5 Validation is supported by various elements present in the form and you can use it to make sure the user knows about which field is mandatory. The different elements in the form group which are supported are:

• <input>s and <textarea>s with .form-control
• <select>s with .form-select
• .form-checks

Bootstrap 5 Validation Supported elements syntax:

<input class="form-control" type="..." 
 id="..." required>
<div class="invalid-feedback">
 ...
</div>

Bootstrap 5 Validation Supported elements used classes:

• invalid-feedback: This class is used to give feedback when the input is not valid or there is no input in red color.

Bootstrap 5 Validation Supported elements used attributes:

• required: This attribute is needed to be added with the input tag which makes the input element mandatory.

Example 1: The code below demonstrates how the validation can be applied on input fields and checks and switches:

Output:

Example 2: The code below demonstrates how the validation doesn't work with disabled inputs:

Output:

Reference:https://getbootstrap.com/docs/5.0/forms/validation/#supported-elements