formsy-material-ui
formsy-react is a form validation component for React forms. This is a wrapper for Material-UI form components to allow them to be used with formsy-react.
Installation
$ npm install formsy-material-ui
Note: For React 0.13.x compatibility, specify formsy-react 0.14.1 in your app.
NB: Material-UI 0.14.1 introduced a regression that made it incompatible with CommonJS require(). Please use Material-UI 0.14.2 or above.
Usage
Note: for FormsyText
you must use value
instead of defaultValue
to set a default value.
As of 0.3.0 the library is split into separate modules, so you can import only those needed for a particular form. This will save overhead particularly if you are not using the Date and / or Time components.
var FormsyCheckbox = ;var FormsyDate = ;var FormsyRadio = ;var FormsyRadioGroup = ;var FormsySelect = ;var FormsyText = ;var FormsyTime = ;var FormsyToggle = ;
If you prefer you can import the whole library, and associated MUI components, by requiring formsy-material-ui
this will have the same footprint, regardless of which components you chose to assign in the following line(s):
ES6:
const FMUI = ;const FormsyCheckbox FormsyDate FormsyRadio FormsyRadioGroup FormsySelect FormsyText FormsyTime FormsyToggle = FMUI;
ES5:
var FMUI = ;var FormsyCheckbox = FMUIFormsyCheckbox;var FormsyDate = FMUIFormsyDate;var FormsyRadio = FMUIFormsyRadio;var FormsyRadioGroup = FMUIFormsyRadioGroup;var FormsySelect = FMUIFormsySelect;var FormsyText = FMUIFormsyText;var FormsyTime = FMUIFormsyTime;var FormsyToggle = FMUIFormsyToggle;
Examples
Example App
Live demo, code: formsy-material-ui
Example Code
const FMUI = ;const FormsyCheckbox FormsyDate FormsyRadio FormsyRadioGroup FormsySelect FormsyText FormsyTime FormsyToggle = FMUI;const RaisedButton = ; const Form = React;
Known Issues
See issues.
Release History
See CHANGELOG.md
Acknowledgements
Originally based on an example by Ryan Blakeley.
Thanks to our contributors.