Core Code
Core Code Modern Dev Handbook

Valid Feedback

Show success messages when inputs are valid.

Preview

Code

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
</head>

<body>

<div class="container py-5">

<label class="form-label">Username</label>

<input class="form-control is-valid">

<div class="valid-feedback">
Looks good!
</div>

</div>

</body>
</html>

More BS5 Form Validation Examples (7)

example Basic Validation open example example Email Validation open example example Invalid Feedback open example example Password Validation open example example Select Validation open example example Checkbox Validation open example example Signup Form Validation open example