Why does Angular.js rock?
Let’s see if we can discover why :) Angular.js is a MV* (Model – View – Whatever) Javascript framework which is maintained by Google which excels in the creation of single-page-applications or even for adding some “magic” to our classic web applications. I could spend all the day writing about why you should try Angular.js in your new project, but I feel that it would be better if we see it in action. Data binding and scopes The first question that usually comes to mind is: Does it support data binding? Let’s see an example of Angular.js’ way of data binding: In this little piece of code, there are a few things to explain but before that, I want you to get familiarized with the code: Try it Insert your name: Echo: NOTE: Don’t worry too much about the ng-app thing at this moment. As you see, what we write in the input, is echoed after it. Ok, but where are we saving that user.name? Alright alright, that wasn’t hard, but…. The idea is something like: Let’s see a complex example: See it Hello, World
Form Validation: The AngularJS Way
Good news first! Recently I started develop my first real AngularJS web app; it shouldn’t be nothing too complicated… I’m just planning to replace my old excel for family budget with a brand new AngularJS app. The registration view was one of the first views I made, when I started to work on this little project. This gave me the opportunity to learn a lot of thing about AngularJS, and in particular how AngularJS handles client side form validation (one of the topic that I usually less appreciate). In this post I will show how perform client side data validation with AngularJS. I will use both built-in directives, both custom directives. Client and Server side validation Before to start, just a question for you: How many times have you heard that client side validation is useless without server side validation? AngularJS directives for form validation AngularJS has many directives to run form validation. The simplest example Fullscreen demo. myForm.username1. myForm.email1. Fullscreen demo.
witoldsz/angular-http-auth
Angular JS: Validating Form Elements in a Repeat
How do I use Angular's form validation on these dynamically created elements? The common scenario is this, you have some ng-repeat creating inputs of some sort, and you need to validate them individually. The knee-jerk reaction is to try to dynamically add names to the input like name="test{{$index}}"... but that won't really work. So now what? ngForm directive! The ng-form directive allows for nesting forms that can be used for things like partial validation. <! So that's the idea in a nutshell.
meliaxford/angular-client-side-auth
Form validation with AngularJS
Client-side form validations are one of the coolest features inside of AngularJS. AngularJS form validation enables you to write a modern HTML5 form that is interactive and responsive from the start. There are many form validation directives available in AngularJS. We’ll talk about a few of the most popular ones here and then we’ll get into how to build your own validations. AngularJS makes it pretty easy for us to handle client-side form validations without adding a lot of extra effort. To use form validations, we first must ensure that the form has a name associated with it, like in the above example. All input fields can validate against some basic validations, like minimum length, maximum length, etc. It is usually a great idea to use the novalidate flag on the form element. Let’s look at all the validation options we have that we can place on an input field: Required To validate that a form input has been filled out, simply add the html5 tag: required to the input field: Minimum length
angular-app/angular-app
Angular JS: Custom Validation via Directives
Okay, for this bit on Angular, I'm going to write up a quick bit on custom validation. I've gone over form validation before , but I think that there are still plenty of cases that Angular's default validation just doesn't cover. A lot of people's first instinct is to resort to calling controller functions to do their validation. You could do that, but that would break the really slick validation model Angular already has in place. What you really want to do is build a directive that requires ngModel . Here is an example of a simple regex validation with a custom validation directive in JSFiddle: Here is the code for the custom validation directive ... and here is an implementation of our custom validation directive in markup: <div ng-app = "myApp" > <div ng-controller = "MainCtrl" > <form name = "myForm" ng-submit = "doSomething()" > <label> Must contain the word <strong> blah </strong> (case insensitive) <br/> <!
Authentication in AngularJS (or similar) based application. | Espeo
Implementation of the concept described below and also a demo application is available here: Hello again, today I would like to write a little bit about how am I handling authentication in an application front-end running inside web browser, using AngularJS. Traditional server ‚login form’? At the beginning, I did not realize that traditional and commonly used form based authentication does not suit my client-side application. Let’s take a look at a sample server-side web application flow of events: Same application, but different flow: user asks for: something.com/secured/formXyz,server sends a login form,user logs in, fills a long and complicated form, but they are doing it so long that theirs session expires,user submits a form, but since the session is not valid anymore, login screen appears,once user logs in, server can process the submitted form, no need to re-enter everything again. OK, so let’s try other way around: Guess what?
