Skip to content

Commit

Permalink
docs: Add JS code snippets for forms (#54577)
Browse files Browse the repository at this point in the history
https://nextjs.org/docs/app/building-your-application/data-fetching/forms-and-mutations

Some of the code blocks where I only specified TS code snippets aren't
working with JS as well (when there are no types). I think I might have
incorrectly assumed you could leave those out. So added the JS snippets
in here (same code, just different file names).
  • Loading branch information
leerob authored Aug 27, 2023
1 parent a221121 commit 6833189
Showing 1 changed file with 69 additions and 1 deletion.
Original file line number Diff line number Diff line change
Expand Up @@ -185,6 +185,17 @@ export default async function submit() {
}
```

```js filename="app/actions.js" switcher
'use server'

import { revalidatePath } from 'next/cache'

export default async function submit() {
await submitForm()
revalidatePath('/')
}
```

Or invalidate a specific data fetch with a cache tag using [`revalidateTag`](/docs/app/api-reference/functions/revalidateTag):

```ts filename="app/actions.ts" switcher
Expand All @@ -198,6 +209,17 @@ export default async function submit() {
}
```

```js filename="app/actions.js" switcher
'use server'

import { revalidateTag } from 'next/cache'

export default async function submit() {
await addPost()
revalidateTag('posts')
}
```

</AppOnly>

### Redirecting
Expand Down Expand Up @@ -244,6 +266,19 @@ export default async function submit() {
}
```

```js filename="app/actions.js" switcher
'use server'

import { redirect } from 'next/navigation'
import { revalidateTag } from 'next/cache'

export default async function submit() {
const id = await addPost()
revalidateTag('posts') // Update cached posts
redirect(`/post/${id}`) // Navigate to new route
}
```

</AppOnly>

### Form Validation
Expand Down Expand Up @@ -740,7 +775,18 @@ You can set cookies inside a Server Action using the [`cookies`](/docs/app/api-r
import { cookies } from 'next/headers'

export async function create() {
const cart = await createCart():
const cart = await createCart()
cookies().set('cartId', cart.id)
}
```

```js filename="app/actions.js" switcher
'use server'

import { cookies } from 'next/headers'

export async function create() {
const cart = await createCart()
cookies().set('cartId', cart.id)
}
```
Expand Down Expand Up @@ -789,6 +835,17 @@ export async function create() {
}
```

```js filename="app/actions.js" switcher
'use server'

import { cookies } from 'next/headers'

export async function create() {
const auth = cookies().get('authorization')?.value
// ...
}
```
</AppOnly>
### Deleting Cookies
Expand Down Expand Up @@ -833,6 +890,17 @@ export async function create() {
}
```
```js filename="app/actions.js" switcher
'use server'

import { cookies } from 'next/headers'

export async function create() {
cookies().delete('name')
// ...
}
```
See [additional examples](/docs/app/api-reference/functions/cookies#deleting-cookies) for deleting cookies from Server Actions.
</AppOnly>

0 comments on commit 6833189

Please sign in to comment.