Skip to content
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.

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

Add option to provide a callback function to focusOnFirstError #3590

Merged

Conversation

Fronix
Copy link
Contributor

@Fronix Fronix commented Apr 8, 2023

Reasons for making this change

fixes #3580

Focusing the first error using focusOnFirstError requires an actual element to be focusable. This is not always possible, you might have disabled fields that are filled by some type of action that the user has missed.

This change provides the option to add a custom callback function to focusOnFirstError, the function recieves a RJSFValidationError in which you can handle what happens then focusOnFirstError is called.

Example:

import { RJSFSchema, RJSFValidationError } from '@rjsf/utils';

const schema: RJSFSchema = {
  type: 'string',
};

const focusOnError = (error: RJSFValidationError) => {
  console.log('I need to handle focusing this error');
};

render(<Form schema={schema} focusOnFirstError={focusOnError} />, document.getElementById('app'));

Checklist

  • I'm updating documentation
  • I'm adding or updating code
    • I've added and/or updated tests. I've run npm run test:update to update snapshots, if needed.
    • I've updated docs if needed
    • I've updated the changelog with a description of the PR
  • I'm adding a new feature
    • I've updated the playground with an example use of the feature

@@ -725,7 +725,11 @@ export default class Form<
errors = merged.errors;
}
if (focusOnFirstError) {
this.focusOnError(schemaValidation.errors[0]);
if (typeof focusOnFirstError === 'function') {
focusOnFirstError(schemaValidation.errors[0]);
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not sure but it could be better to just provide the entire error array here. Though this would change the definition of onFirstError.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yes, that would change the definition.

@heath-freenome heath-freenome merged commit c8db037 into rjsf-team:main Apr 9, 2023
4 checks passed
@Fronix Fronix deleted the add-focusonfirsterror-callback branch April 10, 2023 00:33
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Allow custom focusOnError
2 participants