Skip to content

Commit

Permalink
Add preventScrollReset to form docs
Browse files Browse the repository at this point in the history
  • Loading branch information
brophdawg11 committed Jan 23, 2023
1 parent 07aa818 commit 3d19e46
Show file tree
Hide file tree
Showing 2 changed files with 16 additions and 2 deletions.
12 changes: 12 additions & 0 deletions docs/components/form.md
Original file line number Diff line number Diff line change
Expand Up @@ -215,6 +215,16 @@ See also:
- [`useActionData`][useactiondata]
- [`useSubmit`][usesubmit]

## `preventScrollReset`

If you are using [`<ScrollRestoration>`][scrollrestoration], this lets you prevent the scroll position from being reset to the top of the window when the form action redirects to a new location.

```tsx
<Form method="post" preventScrollReset={true} />
```

See also: [`<Link preventScrollReset>`][link-preventscrollreset]

# Examples

TODO: More examples
Expand Down Expand Up @@ -318,3 +328,5 @@ You can access those values from the `request.url`
[formvalidation]: https://developer.mozilla.org/en-US/docs/Learn/Forms/Form_validation
[indexsearchparam]: ../guides/index-search-param
[pickingarouter]: ../routers/picking-a-router
[scrollrestoration]: ./scroll-restoration
[link-preventscrollreset]: ./link#preventscrollreset
6 changes: 4 additions & 2 deletions docs/components/scroll-restoration.md
Original file line number Diff line number Diff line change
Expand Up @@ -83,13 +83,14 @@ Or you may want to only use the pathname for some paths, and use the normal beha

## Preventing Scroll Reset

When navigation creates new scroll keys, the scroll position is reset to the top of the page. You can prevent the "scroll to top" behavior from your links:
When navigation creates new scroll keys, the scroll position is reset to the top of the page. You can prevent the "scroll to top" behavior from your links and forms:

```tsx
<Link preventScrollReset={true} />
<Form preventScrollReset={true} />
```

See also: [`<Link preventScrollReset>`][preventscrollreset]
See also: [`<Link preventScrollReset>`][preventscrollreset], [`<Form preventScrollReset>`][form-preventscrollreset]

## Scroll Flashing

Expand All @@ -99,4 +100,5 @@ Server Rendering frameworks can prevent scroll flashing because they can send a

[remix]: https://remix.run
[preventscrollreset]: ../components/link#preventscrollreset
[form-preventscrollreset]: ../components/form#preventscrollreset
[pickingarouter]: ../routers/picking-a-router

0 comments on commit 3d19e46

Please sign in to comment.