Material UI Form Fields
See Demo
See API.md for details
Requirements
- React >= 16.0.0
- Material-ui >= 1.0.0
Install
yarn add material-ui-form-fields
Usage
Individual field
// import import FieldText from 'material-ui-form-fields/components/Text'; // render() <FieldText = ='Email' ='email' = = ='required|email' = /> // onSubmit() ifthisfield console;
Complete Form
// import import ValidationContext from 'material-ui-form-fields/components/ValidationContext'; import FieldText from 'material-ui-form-fields/components/Text'; // render() <ValidationContext => <FieldText = ='Email' ='email' = ='required|email' = /> <FieldText ='Senha' ='password' = ='required' = /> </ValidationContext> // onSubmit() ifthisvalidation console;
Config
Global Setup example:
;;; ;
Validation Rules and Config
See validatorjs
Validation Context
<FieldDate ='Begin Date' ='begin' = ='date' =/> <FieldDate ='End Date' ='end' = ='date|after_or_equal:begin date' //_or_equal ( 'begin date') = // =/>
Mask
Only FieldText has mask prop;
// register ; // -optional ; // usage <FieldText label='Phone' type='text' mask='my-new-mask' value=phone onChange= this) />
Common Masks
PT-BR:
- zipcode
- phone
- document (CNPJ/CPF)
- cpf
- cnpj