Browser default validation with using the required
keyword. Try submitting the form below. Depending on your browser and OS, you’ll see a slightly different style of feedback.
For custom Bootstrap form validation messages, you’ll need to add the novalidate
boolean attribute to your <form>
. This disables the browser default feedback tooltips, but still provides access to the form validation APIs in JavaScript.
If your form layout allows it, you can swap the .{valid|invalid}-feedback
classes for .{valid|invalid}-tooltip
classes to display validation feedback in a styled tooltip. Be sure to have a parent with position: relative
on it for tooltip positioning. In the example below, our column classes have this already, but your project may require an alternative setup.