AngularJS registration forms

red_ice

Just wondering what peoples views are on using AngularJS for form validation over jQuery? Obviously, FE validation is rubbish, but to check that box and keep a client happy...

I understand that Angular is primarily a framework for SPAs, but do you think it would be worth while using it to power a long form / registration process, where users have to fill out 4/5 data sets before the checkout phase is complete? When the form is complete, create hidden fields and populate them from data from $scope which you collected via the previous views, then pass it off as a standard form post?

Is this viable or even good practice? I'm finding it hard to get a good reason to learn / use Angular in anything I build, if its worth while using it for registration / checkout forms, I have a few projects lined up.

Thanks

Talisman

jQuery and AngularJS are two different mindsets. If you look at AngularJS with a jQuery mindset you will never see the potential because DOM manipulation isn't really part of AngularJS way of doing things.

jQuery is anchored in the archaic Web 1.0 land that people have grown up with and web developers have become comfortable with. It's all about manipulating the DOM. You need to build the HTML and then use selectors to hook into it.

jQuery approach : I have this DOM element and I want to make it do something.

AngularJS approach : Put this data in that view (template).

AngularJS is about the data (Model), manipulating the DOM is not a concern. If you want to use AngularJS in place of jQuery you can do because the creators built in a trapdoor to allow you to do so: Directives.

AngularJS leverages the idea of Web Components - custom elements that extend the HTML. In the case of your form validation, if you used AngularJS you could have a Directive for each of the elements or the form itself. You can take them to another project simply by including the JavaScript code and adding your ng Directive attribute to an element of the HTML. AngularJS compiles the HTML and executes the ng Directives - that makes it very powerful and not very SEO friendly but that is changing. Take a look at CustomElements.io, Polymer, X-Tag and you'll come to see the power of the Web Components approach.

I know this doesn't answer your question directly, but when you stop thinking in terms of jQuery you will see how you could use AngularJS in your projects.

Giblet

Do not use Angular JS for anything, ever. It's too slow. They are rewriting it completely at the moment. Now is not a good time to learn, and it really doesn't fit on anything but SPA (an I prefer React anyway!). For validation, we use server side exclusively with a callback to validate on the client. It can be done with ajax quite nicely these days, giving you only one place to define your validation, using the returned JSON to "markup" the form, saying which properties are invalid etc.

http://timgthomas.com/2013/09/simplify-client-side-validation-by-adding-a-server/

If it isn't an option, jQuery validation works, although I don't like it.