Form

Lead Designer: Adrian

Lead Developer: Tauseef

User Story

We want to offer a comprehensive solution for creating and displaying forms. Forms have become a much more complex and require many more data types than just those provided default by HTML specs. Its also necessary that they provide instant validation for users. By creating custom bossy form directive we can create a more comprehensive and feature rich set of input types.

Forms are one of the most common and more complicated HTML elements and Angular naturally provides some increased functionality but building on this we can create a more opinionated form directive that can accommodate the requirements of modern computers and mobile devices. Adding input types and specialized javascript to handle email address, phone numbers, twitter handles, password validation and searchable select boxes will provide users with a more robust user experience.

If a user is building any form requiring common data types they should be able to implement a Bossy input type that should make entering that information easy.

Case 1: developer/designer is building a checkout system. They require, name, address, email and billing info. Name is entered in a single field but is auto broken into first and last name data object. Address auto suggests possible street addresses as the user types. Zip code auto fills City and State loading those into an object on the back end. As the user beings to fill in the email a dropdown appears with common email domains that a user can select and the field instantly validates for valid email address. The credit card number field checks for page security and displays a visual indicated that the data being entered is safe and sensitive information is auto hidden but with a button to show password.

MVP

Searchable Select Box Options will be auto filtered by a search term in a select box Auto format phone numbers Phone numbers will be formatted with the correct ( ) - format as the user types City and State will auto populate based on Zip code instead of requiring additional fields Email will auto suggest common email domains Input Field will create drag and drop field Date/Time will auto launch calendar/date-time directive Color will launch color picker directive.