react-scroll-to-first-error

A react hook for doing scroll to an invalid input on onSubmit. Works with any standard form and with other libraries like material-ui

Install

npm install --save react-scroll-to-first-error

Usage

      import React, { useRef } from 'react'
      import useScrollToError from 'react-scroll-to-error'

      function App() {
        const formEl = useRef(null);

        useScrollToError(formEl);

        return (
          <div>
            <form ref={formEl} noValidate>
              <input type="text" name="name" id="name" required />
              <input type="text" name="phone" id="name" />
              {/* we force height here for testing purposes */}
              <div style={{ height: "100vh" }} />
              <button type="submit">Submit</button>
            </form>
          </div>
        );
        }

License

GPL-3.0 © dieguezz