Skip to content
  • Sessions
  • Workshops
  • Speakers
  • Sponsors
  • Schedule
  • About
  • Contact
Menu
  • Sessions
  • Workshops
  • Speakers
  • Sponsors
  • Schedule
  • About
  • Contact
Register
  • Sessions
  • Workshops
  • Speakers
  • Sponsors
  • Schedule
  • About
  • Contact
Menu
  • Sessions
  • Workshops
  • Speakers
  • Sponsors
  • Schedule
  • About
  • Contact
Register
Register
view all sessions
View Schedule

Ward Bell

General Session

Form Validation Done Right

Almost everything you’ve been told about form validation is a bad practice. Why? Because it tells you to validate the form instead of the model. That’s backward.

Let me ask you an unsettling question: “is the field required because the form says so or because it’s a business model requirement? Would the model be invalid even if we never displayed that field?”

Of course we have to express the required rule in the UI. We must tell the user the value is missing and (perhaps) force the user to enter it. But the value is still required whether the field appears on the form or not. And that is just the start of our troubles.

We’d like to tell the user if the whole model is valid. We’d want to block certain operations if the model is invalid anywhere. We’d love to display a list of all invalid fields with links the user can click to navigate to the page where they can fix the problem. We’d prefer to find, document, and maintain all of the validation rules in one place and write unit tests for them. We’d like to apply the same rules on both server and client without writing them twice. None of that is possible with validations embedded in forms.

This talk is a follow-up to my impassioned argument for Template Driven forms at last year’s ngConf (https://www.youtube.com/watch?v=L7rGogdfe2Q). Many folks (incorrectly) try to argue that validation is a weakness of Template Driven forms. I will show that Angular validation, as taught, is a weakness of Reactive forms as well. What we need is a model-driven validation library that integrates with both modalities, one that is powerful and easy to use in the scenarios you wish you could handle today.

Of course I’ll show you an open-source validation library that we wrote and have used at our biggest Angular client for the last 3 years.

Ward Bell_02

Ward Bell

General Session

Form Validation Done Right

Almost everything you’ve been told about form validation is a bad practice. Why? Because it tells you to validate the form instead of the model. That’s backward.

Let me ask you an unsettling question: “is the field required because the form says so or because it’s a business model requirement? Would the model be invalid even if we never displayed that field?”

Of course we have to express the required rule in the UI. We must tell the user the value is missing and (perhaps) force the user to enter it. But the value is still required whether the field appears on the form or not. And that is just the start of our troubles.

We’d like to tell the user if the whole model is valid. We’d want to block certain operations if the model is invalid anywhere. We’d love to display a list of all invalid fields with links the user can click to navigate to the page where they can fix the problem. We’d prefer to find, document, and maintain all of the validation rules in one place and write unit tests for them. We’d like to apply the same rules on both server and client without writing them twice. None of that is possible with validations embedded in forms.

This talk is a follow-up to my impassioned argument for Template Driven forms at last year’s ngConf (https://www.youtube.com/watch?v=L7rGogdfe2Q). Many folks (incorrectly) try to argue that validation is a weakness of Template Driven forms. I will show that Angular validation, as taught, is a weakness of Reactive forms as well. What we need is a model-driven validation library that integrates with both modalities, one that is powerful and easy to use in the scenarios you wish you could handle today.

Of course I’ll show you an open-source validation library that we wrote and have used at our biggest Angular client for the last 3 years.

Loading...
Loading...

Sessions: Aug 31 - Sep 2

Workshops: Aug 29 - 30

  • Grand America Hotel. Salt Lake City. UT. USA
Register Now

Sitemap

  • Sessions
  • Workshops
  • Speakers
  • Sponsors
  • Schedule
  • About
  • Contact

Resources

  • Blog
  • School
  • Scholarships
  • Code of Conduct
  • Covid Protocol
  • Jobs
  • FAQ

Past Events

  • ng-conf 2017
  • ng-conf 2018
  • ng-conf 2019
  • ng-conf 2020
  • ng-conf 2021
  • EnterpriseNG 2021
  • Reliable Web Summit 2021
Register
Twitter Youtube Medium

©Pentamorous. All rights reserved. Designed by TransactionFactory.io

ng-conf 2022

Sessions
Workshops
Speakers
Sponsors
Schedule
About
Contact
Register

Sessions: Aug 31 - Sep 2

Workshops: Aug 29 - 30

  • Grand America Hotel. Salt Lake City. UT. USA

Get notified

 Join our exclusive newswire for ng-conf news, workshops, sessions, speakers announcements, and more as we count down to ng-conf!

Stay updated

 Join our exclusive newswire for speaker announcements, workshops, sessions info and all the latest ng-conf info.