7

Is there an approach that preserves the single-definition of validation, allows immediate client-side validation, and still provides the strength of server-side validation?

I'm familiar with the following two approaches:

The first renders ng-validation syntax in Razor output, based on rules stated in the model. That seems like it couples me too tightly to building Razor views, when Razor views often won't intuitively pair with a well-organized Angular app. I could use this approach, but it seems it's more a result of someone wanting to replicate "Unobtrusive jQuery/MVC Validation", than building something well-suited to Angular.

The second approach just returns server-side validation back to Angular to render. It also doesn't do a thorough job of it. If needed I could run without client-side validation, since a single-page app still won't get screen flashes... but it's not ideal.

For example, maybe there is a toolset to more directly reflect the validation rules directly on WebAPIs and consume them in an Angular app. Or another approach that I haven't found?

At https://www.youtube.com/watch?v=lHbWRFpbma4#t=1336 , the presenter seems to imply this problem is already well-solved for Angular, and refers to specification (DDD Using Specification pattern for Validation). If you are aware of any tools that make this applicable to my problem, I'd love to hear it.

p.s. It seems like this is almost certainly an often-asked question. I'm sorry I was unable to find an answer here before posting

p.p.s. I'm currently planning to use Entity Framework, but I'd switch to address this. Heck, I'd consider switching to a whole different platform for this, my first Angular-focused project.

Community
  • 1
  • 1
shannon
  • 8,664
  • 5
  • 44
  • 74
  • Have you considered using Node.js for the server side, which would allow you to create "classes" in JS for your models that could have validation embedded, and which can be used on both the client and the server? I have no experience with this personally, but I understand that it is theoretically possible. – GregL Sep 30 '14 at 00:29
  • 1
    One more note: I found [this series of posts](http://journal.crushlovely.com/post/88286828068/7-patterns-to-refactor-javascript-applications-value) on good JS patterns illuminating, you may too. Because they are just vanilla JS, they may lend themselves well to being used on both the client and server. – GregL Sep 30 '14 at 00:32
  • Thank you Greg. On your first comment, I'm imagining a monstrosity of automapping models into my node.js classes, then back out into my data models, which then obviously still must pass into the data services. Instinctively, I'm also a little shy of using javascript anything as a security layer at my server. I'm not saying it can't work, my brain is just screaming "be very afraid". – shannon Sep 30 '14 at 06:30
  • I'm using angularjs built-in validations for client side and mvc annotations for server side. With this solution you can't get anything wrong. – Marian Ban Sep 30 '14 at 07:23
  • 1
    MajoB: I'm not sure if it was clear, but I was looking for a way to only define the validation rules in a single place, because defining two separately increases the likelihood of implementation errors. e.g. differing min/max string lengths. – shannon Sep 30 '14 at 14:55
  • 1
    One options is to just output the metadata for the model in a JSON format. Then you will just need to map the particular validation attributes to an equivalent client-side rule. – Esteban Felix Oct 02 '14 at 15:59

1 Answers1

2

The approach I recommend is based on @Esteban Felix commented and I used similar strategy in Java/Bean Validation and JSON schema generator.

Annotate your Domain model using Validate Model Data Using DataAnnotations

Generate schema using JSON.net other useful links

Create a AutoValidate directive that goes on and decorate fields with AngularJS build in directives for form validation e.g. ngPattern and simple things like min/max. In my case I created a mapping from Java world to AngularJS directives and wherever I needed we created custom directives.

Community
  • 1
  • 1
bhantol
  • 9,368
  • 7
  • 44
  • 81
  • I've accepted this answer for now, as an indication that such a framework does not already exist in a complete form. If you've visited here and found that it does exists, please add an answer! – shannon Jul 18 '15 at 20:39
  • @shannon Not aware of any such framework. You may find some useful JS code in `~/Scripts/MicrosoftMvcValidation.debug.js` mentioned in the `DataAnnotate` link. I haven't looked at it or know where is the source is but that Javascript might be useful in rolling your own. – bhantol Jul 20 '15 at 03:21