fix: Fixed #30

demo/src/components/FormRegisterMaterial.jsx

@@ -72,6 +72,7 @@ const FormRegister = ({ form }) => (
         <br />
         <div className="ctrl">
           <button
+            disabled={!form.isValid}
             type="submit"
             onClick={form.handleOnSubmit}
           >Submit</button>

docs/CustomValidationFunctions.md

@@ -24,17 +24,14 @@ export function isEmail({ field }) {
 
 ```javascript
 const fields = {
-  username: {
-    label: 'Username',
-    value: '[email protected]',
-    validate: [isEmail, shouldBeEqualTo('email')],
-    related: ['email'],
-  },
+  ...
   email: {
     label: 'Email',
-    value: '[email protected]',
-    validate: isEmail,
-    related: ['username'],
+    related: ['emailConfirm'],
+  },
+  emailConfirm: {
+    label: 'Confirm Email',
+    validate: [isEmail, shouldBeEqualTo('email')],
   },
   ...
 };

docs/DefiningFields.md

@@ -70,3 +70,17 @@ const fields = {
 };
 ```
 
+### Set `related` fields to be validated at the same time
+
+```javascript
+const fields = {
+  email: {
+    label: 'Email',
+    validate: isEmail,
+    related: ['emailConfirm'], // <<---
+  },
+  emailConfirm: {
+    label: 'Confirm Email',
+    validate: [isEmail, shouldBeEqualTo('email')],
+  },
+};

src/Field.js

@@ -216,6 +216,7 @@ export default class Field {
     return (!_.isEmpty(this.validationAsyncData)
       && (this.validationAsyncData.valid === false))
       || (this.validationErrorStack.length !== 0)
+      || _.isString(this.asyncErrorMessage)
       || _.isString(this.errorMessage);
   }
 

tests/test.js

@@ -64,7 +64,7 @@ describe('Form isValid', () => {
   it('$H isValid should be true', () => expect($H.isValid).to.be.true);
   it('$I isValid should be true', () => expect($I.isValid).to.be.true);
   it('$L isValid should be false', () => expect($L.isValid).to.be.false);
-  it('$M isValid should be true', () => expect($M.isValid).to.be.true);
+  it('$M isValid should be false', () => expect($M.isValid).to.be.false);
   it('$N isValid should be false', () => expect($N.isValid).to.be.false);
 });
 
@@ -170,6 +170,9 @@ describe('others fields', () => {
   it('$M username.initial should be equal to "SteveJobs"', () =>
     expect($M.fields.username.initial).to.be.equal('SteveJobs'));
 
+  it('$M username.isValid should be false', () =>
+    expect($M.fields.username.isValid).to.be.false);
+
   it('$N email.isValid should be false', () =>
     expect($N.fields.email.isValid).to.be.false);