Created by: jendowns
Resolves #1057 (closed)
Summary of changes
Build
- Use
gulp-uglify-es
(this was a bit of a personal pref when writing these functions, to make things easier with template strings and so forth. Please let me know if you have any concerns about this vsgulp-uglify
!) - Do not purge styles with
c-form
class names (this is specifically to keep error message related styles from being removed)
CSS
- Add styling for error wrapper, summary, and message (link) elements.
Markup
- Use
novalidate
attribute on forms to prevent default HTML5 validation. This was necessary because otherwise, the HTML5 validation would take control after submitting invalid form fields -- it would generate its own tooltips & then move focus to the first invalid field. Withnovalidate
, we can control focus after submit (and in this case, send focus to the first error message link).
JS
- Add submit handler and functions to validate, add error messages, clean up, etc. Note that for the email validation, I kept the validation as close to the default HTML5 email validation as possible... it only requires one character +
@
+ another character (i.e., likea@a
). I think the only way to truly check an email address is to try to send an email to it, and this regex is more geared toward helping people catch common mistakes.
That's a general summary of the changes. Please let me know what you think! I tried to add notes here and there, but let me know if they are too verbose, etc. Thank you!