Forms and form validation

Description

A-Level Angular Note on Forms and form validation, created by James Drummond on 19/05/2015.
James Drummond
Note by James Drummond, updated more than 1 year ago
James Drummond
Created by James Drummond over 9 years ago
3
0

Resource summary

Page 1

Checkboxes If you bind a checkbox to a model, the model will be true if the checkbox is checked, false if it's not.- You can set a specific value for the true / false values with ng-true-value="melons" ng-false-value="noMelons"

Radio buttons Just assign the same model to all the radio buttons in the group and use the value attribute as normal.input type="radio" ng-model="myForm.whichNewsletter" value="weeklyNews"> input type="radio" ng-model="myForm.whichNewsletter" value="monthlyNews"

Select boxes Just do as normal:select ng-model='myForm.car'option value='nissan'You can also use ng-options to create dynamic selects which are tied to the scope.

Form Validation Set min and max lengths: input type="text" id="name" ng-model="myForm.name" ng-minlength="5" ng-maxlength="12"*Required*Just use HTML5 - put required in the form and Angular will pick it up automaticallyIf the input type is set to email, Angular will automatically validate it. Form and control states Use 'novalidate' on the form element to prevent HTML5 validation rules and use your own.$pristine, $dirty, $valid, $invalid - can be applied to individual controls or the whole form.Use ng-disabled to disable the submit button until the form is valid.

Show full summary Hide full summary

Similar

Plato - Forms
Heloise Tudor
VERB TO BE
ingry Bravo
The Princeton Review Chapter 9 Rotational Motion
Anibal Santamaria
Angular
Kingsley Bawuah
Quiz Validation
Anass ECP
The Creation of The World
sr.carmentherese
Plato and Philosophy of Religion
laur_sh
Oracle 1z0-151
Mahbubul Alam
Angular Nuts and Bolts
James Drummond
Scope and Inheritance in Angular
James Drummond