Skip to content

Skip Form validating at first render #277

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
duylam wants to merge 3 commits into
base: master
Choose a base branch
from
Open

Skip Form validating at first render #277

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
50af2f3
Add validateOnMount option on Form to skip validating at first render…
duylam Dec 3, 2015
7d38b6b
Merge commit '4931256105b2d9e6c657d2d3a29846847dd34189'
duylam Dec 28, 2015
b4d03e2
Add missing case for conditional validating form on "mount" event
duylam Dec 28, 2015
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions API.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@
- [getModel()](#getmodel)
- [updateInputsWithError()](#updateinputswitherrorerrors)
- [preventExternalInvalidation](#preventexternalinvalidation)
- [validateOnMount](#validateOnMount)
- [Formsy.Mixin](#formsymixin)
- [name](#name)
- [value](#value)
Expand Down Expand Up @@ -220,6 +221,12 @@ var MyForm = React.createClass({
```
With the `preventExternalInvalidation` the input will not be invalidated though it has an error.

#### <a name="validateOnMount">validateOnMount</a>
```html
<Formsy.Form validateOnMount={true|false}></Formsy.Form>
```
`validateOnMount` indicates that whether Formsy.Form validates all its inputs immediately after the initial rendering occurs (e.g componentDidMount). By default it's `true` e.g validate on componentDidMount

### <a name="formsymixin">Formsy.Mixin</a>

#### <a name="name">name</a>
Expand Down
9 changes: 7 additions & 2 deletions src/main.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ Formsy.Form = React.createClass({
onInvalid: function () {},
onChange: function () {},
validationErrors: null,
validateOnMount: true, // avoid break change
preventExternalInvalidation: false
};
},
Expand Down Expand Up @@ -70,7 +71,9 @@ Formsy.Form = React.createClass({
},

componentDidMount: function () {
this.validateForm();
if (this.props.validateOnMount) {
this.validateForm();
}
},

componentWillUpdate: function () {
Expand Down Expand Up @@ -408,7 +411,9 @@ Formsy.Form = React.createClass({
this.inputs.push(component);
}

this.validate(component);
if (this.props.validateOnMount) {
this.validate(component);
}
},

// Method put on each input component to unregister
Expand Down