AtomFormLayout is a special control, which encapsulates general form layout, i.e. display a label and required asterix and error label for erronous data. AtomFormLayout encapsulates every control within a class called AtomFormField, you need not define this type, it is automatically created by AtomFormLayout.
Every children of AtomFormLayout can define, atom-label, atom-required, atom-is-valid, atom-data-type. atom-regex, atom-field-value and atom-field-class.
atom-label | Label will be displayed on left side of form with right aligned by default. |
atom-required | This will setup default validation for field to be required, if set true, either value of element or atom-field-value cannot be empty. |
atom-is-valid | In case when you have multiple required elements in one field, you can use this to bind to a valid expression, or you can use this to bind to custom expression that evaluate to true. |
atom-data-type | If you setup data-type as email, field will be validated for perfect email address. |
atom-regex | If you setup regex, it will be tested against atom-field-value or value of element. |
atom-field-value | If child control does not have value property, then you can bind this to any property of data that will be validated. |
atom-field-visible | You can bind this property to hide/show the field based on some boolean condition |
atom-field-class | CSS class that should be applied to entire Field Row. |
Sometimes you may not need form, you can simply use AtomFormLayout or its derivative AtomFormVerticalLayout to display items along with errors and just use them to validate before doing some action.