diff --git a/.github/workflows/release-docs.yml b/.github/workflows/release-docs.yml index 8921ac0aea..3b4fd8c31c 100644 --- a/.github/workflows/release-docs.yml +++ b/.github/workflows/release-docs.yml @@ -25,6 +25,8 @@ jobs: runs-on: ubuntu-latest steps: - uses: actions/checkout@v3 + with: + ref: main - name: Setup Python uses: actions/setup-python@v3 with: diff --git a/CHANGELOG.md b/CHANGELOG.md index 3ba8950d17..cd0b2c8488 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -22,6 +22,7 @@ should change the heading of the (upcoming) version to include a major version b ## @rjsf/core - Updated the `FieldErrorTemplate` to remove the explicit typing of the `error` to string to support the two options +- Implemented programmatic validation via new `validateForm()` method on `Form`, fixing (https://github.com/rjsf-team/react-jsonschema-form/issues/2755, https://github.com/rjsf-team/react-jsonschema-form/issues/2552, https://github.com/rjsf-team/react-jsonschema-form/issues/2381, https://github.com/rjsf-team/react-jsonschema-form/issues/2343, https://github.com/rjsf-team/react-jsonschema-form/issues/1006, https://github.com/rjsf-team/react-jsonschema-form/issues/246) ## @rjsf/semantic-ui - Updated the `FieldErrorTemplate` to use the `children` variation of the `List.Item` that supports ReactElement @@ -31,6 +32,8 @@ should change the heading of the (upcoming) version to include a major version b ## Dev / docs / playground - Updated the `custom-templates.md` file to add the missing asterisk to the new `FieldErrorTemplate` and `FieldHelpTemplate` +- Updated the playground to add a new button for programmatically validating a form +- Also updated the `validation.md` documentation to describe how to programmatically validate a form # 5.0.0-beta.8 diff --git a/docs/usage/validation.md b/docs/usage/validation.md index 51b5af227b..f5e9bbad6e 100644 --- a/docs/usage/validation.md +++ b/docs/usage/validation.md @@ -34,6 +34,33 @@ render(( ), document.getElementById("app")); ``` +## Validate form programmatically + +It is possible to programmatically validate a form using the `validateForm()` function on `Form`. +Add a `ref` to your `Form` component and call the `validateForm()` method to validate the form programmatically. +The `validateForm()` method returns true if the form is valid, false otherwise. +If you have provided an `onError` callback it will be called with the list of errors when the `validatorForm()` method returns false. + +```jsx +import { createRef } from "react" +import validator from "@rjsf/validator-ajv6"; + +const formRef = createRef(); +const onError = (errors) => alert(errors); + +const schema = { + type: "string" +}; + +render(( +