Bootstrap communicates field validity with modifier classes—not magic validation logic. Add is-valid or is-invalid on controls; pair with valid-feedback or invalid-feedback siblings that show messages.
Server vs client validation
Your backend or JavaScript decides validity; Bootstrap only styles the result. For submit-time validation on a whole form, add was-validated to the <form> and use native required / pattern attributes—invalid fields pick up styles after submit attempt.
Accessibility
Set aria-invalid="true" on invalid fields and reference error text with aria-describedby. Visual red borders are not enough for screen reader users.
Self-check
- Which class shows the green check styling on an input?
- What does
was-validatedon the form enable? - Name one ARIA attribute that complements
is-invalid.
Interview prep
- How do you show invalid feedback accessibly?
Use
is-invalid, associateinvalid-feedbackwitharia-describedby, and avoid color alone.