aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorMark Otto <[email protected]>2017-06-05 20:21:08 -0700
committerMark Otto <[email protected]>2017-06-05 20:21:08 -0700
commitaf097bd5bf18a12e6bfb4f8ee59459517062a379 (patch)
tree0e527b45746d1ccbf0053f8fa829f43ec33722d4
parent4a554e5ff5fd8a2e82cfbea3f301049c0de48d2a (diff)
downloadbootstrap-af097bd5bf18a12e6bfb4f8ee59459517062a379.tar.xz
bootstrap-af097bd5bf18a12e6bfb4f8ee59459517062a379.zip
start rewriting
-rw-r--r--docs/4.0/components/forms.md12
1 files changed, 10 insertions, 2 deletions
diff --git a/docs/4.0/components/forms.md b/docs/4.0/components/forms.md
index 6c3272dc1..3fc7bfddc 100644
--- a/docs/4.0/components/forms.md
+++ b/docs/4.0/components/forms.md
@@ -809,11 +809,19 @@ Inline text can use any typical inline HTML element (be it a `<small>`, `<span>`
## Validation
-Bootstrap includes validation styles for danger, warning, and success states on most form controls.
+Provide valuable, actionable feedback to your users with HTML5 form validation–[available in all our supported browsers](http://caniuse.com/#feat=form-validation). Choose from the browser default validation feedback, or implement custom messages with our built-in classes and starter JavaScript.
+
+**We highly recommend using custom validation messages as native browser validation is not announced to most assistive technologies like screenreaders.**
### How it works
-Here's a rundown of how they work:
+Here's a rundown of how form validation works:
+
+- HTML form validation includes support for two CSS pseudo-classes, `:invalid` and `:valid`, for use on `<input>`s.
+- All modern browsers support the [constraint validation API](https://www.w3.org/TR/html5/forms.html#the-constraint-validation-api), a series of JavaScript methods for validating form controls.
+- You may choose to rely on the browser default validation feedback, or implement custom feedback styles with HTML and CSS.
+- You may provide custom validity messages with `setCustomValidity` in JavaScript.
+
- To use, add `.has-warning`, `.has-danger`, or `.has-success` to the parent element. Any `.col-form-label`, `.form-control`, or custom form element will receive the validation styles.
- Contextual validation text, in addition to your usual form field help text, can be added with the use of `.form-control-feedback`. This text will adapt to the parent `.has-*` class. By default it only includes a bit of `margin` for spacing and a modified `color` for each state.