Skip to content

Commit ea9124c

Browse files
authored
Update README.md
1 parent aebf2b7 commit ea9124c

File tree

1 file changed

+26
-8
lines changed

1 file changed

+26
-8
lines changed

README.md

Lines changed: 26 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -191,24 +191,42 @@ With the instance in hand, we can pass it our `<Form />` component:
191191
const LoginForm = () => (
192192
<Form
193193
instance={instance}
194-
onSubmit={() => {
194+
onUpdate={(id, value) => {
195+
// Do stuff
196+
}}
197+
onSubmit={hasError => {
195198
// Do stuff
196199
}}
197200
/>
198201
);
199202
```
200203

201-
And once filled out, `onSubmit` will get us the form responses:
204+
And once filled out, `onSubmit` will get us the form responses, and also pass along the state of the form
202205

203206
```jsx
204207
const LoginForm = () => (
205208
<Form
206-
hideFormTitle
207-
submitButtonLabel="Login"
208209
instance={instance}
209-
onSubmit={() => {
210-
console.log(instance.getModel()); // Get form responses
211-
console.log(instance.serializeModel()); // Serialize form responses
210+
onUpdate={(id, value) => {
211+
// Log the change set
212+
console.log(`FieldId ${id} was changed to ${value}`);
213+
214+
// Get the full validation results of the field
215+
console.log(instance.getValidationResultById(id);
216+
217+
// Get just the validation status of the field (i.e. ERROR, OK)
218+
console.log(instance.getValidationStatusById(id);
219+
}}
220+
onSubmit={hasError => {
221+
if (hasError) {
222+
// Get form validation results
223+
console.log(intance.getValidationResults(id));
224+
}
225+
// Get form responses
226+
console.log(instance.getModel());
227+
228+
// Serialize form responses
229+
console.log(instance.serializeModel());
212230
}}
213231
/>
214232
);
@@ -233,7 +251,7 @@ Form definitions adhere to a strict schema. They must contain at least **one sec
233251
234252
> View the full schema in the [FormAPIService](https://github.com/mikechabot/react-json-form-engine/blob/master/src/form/service/form-api-service.js#L27)
235253
236-
> In forms with a single section, vertical tabs are not displayed. In sections with a single subsection, horizontal tabs are not displayed.
254+
> In forms with a single section, vertical tabs are not displayed. In sections with a single subsection, horizontal tabs are not displayed. See the [Layout](https://mikechabot.github.io/react-json-form-engine-storybook/?path=/story/layout--multi-section) demos on storybook.
237255
238256
```js
239257
// The most minimal form possible

0 commit comments

Comments
 (0)