final-form-scroll-to-errors
v1.1.0
Published
Decorator for ๐ Final Form that will attempt to apply focus to the first field with an error upon an attempted form submission.
Downloads
10
Maintainers
Readme
Final Form Scroll To Errors
Decorator for ๐ Final Form that will attempt to apply focus to the first field with an error upon an attempted form submission.
๐ Installation
First we will have to install, in order to use this wonderful package.
# Using npm
npm install --save final-form-scroll-to-errors@latest
# Using yarn
yarn add final-form-scroll-to-errors@latest
๐ Usage
final-form-scroll-to-errors uses the scroll-into-view-if-needed package, so we invite you to check the documentation https://github.com/stipsan/scroll-into-view-if-needed
import * as React from 'react'
import { Form, Field } from 'react-final-form'
import createDecorator from 'final-form-scroll-to-errors'
const scrollOnErrors = createDecorator()
...
<Form
onSubmit={submit}
decorators={[ scrollOnErrors ]}
validate={validate}
render={({ handleSubmit }) =>
<form onSubmit={handleSubmit}>
... inputs here ...
</form>
}
/>
๐ฉ Stay in touch
- Github @yonycalsin
- Twitter @yonycalsin
๐ Contributors
Thanks to the wonderful people who collaborate with me !
๐ License
final-form-scroll-to-errors
under License MIT.