angular-smart-forms

Angular components for making HTML forms smart. Compatible with AngularJS 1.3.4+.

Why?

HTML5 forms are getting smarter. Let's help this process.

This project provides some directives to be applied on forms and form elements, to handle specific requirements not yet covered by native implementations.

Behaviours implemented:

Focus first element on page load;
Focus first invalid element on submit, in case it fails;
Focus next element on pressing ENTER key;
Focus next element on completing input on an element;
Present date input with string models;
Present formatted numeric input;

All this work is based on the following assumptions:

If it is flexible, then it would solve most problems, even ones not aimed by the library author's;
Provide convenience without sacrificing flexibility;
By keeping code base simple, it is easier to reason about and evolve;
By fully covering with tests, it can evolve without introducing bugs.

Features

Components

HTML form:
- Smart form: focus elements responding to keyboard input;
- Auto focus: focus elements responding to $viewContentLoaded, $includeContentLoaded, and submit events;
HTML input:
- ISO date: store dates as a string in ISO format and display them conveniently with an input[type=date];
- Numeric input: display formatted number on input[type=number]'s

Usage

Auto focus

<form name="ctrl.mainForm" wt-auto-focus>
...
</form>

Smart form

<form name="ctrl.mainForm" wt-smart-form>
...
</form>

ISO dates

<input type="date" wt-iso-date ng-model="ctrl.dateField">

Numeric input

<input type="number" wt-number ng-model="ctrl.numericField">

Installation

Bower

bower install angular-smart-forms --save

Application

HTML

<script type="text/javascript" src="release/angular-smart-forms.min.js"></script>

JavaScript

var app = angular.module('app', ['wt.smart']);

License

MIT

Angular Smart Forms

Angular components for making HTML forms smart