From 8e3438970fe9c0538c53f7893a2a6454b7db1b29 Mon Sep 17 00:00:00 2001
From: James Trenda <jamestrenda@gmail.com>
Date: Tue, 10 Jun 2025 17:04:44 -0400
Subject: [PATCH] docs(nextjs-ssr): clarify need for HTML name attribute in
 native form submissions

add inline comments to client components in next.js server action examples
highlighting the need to explicitly set the name attribute on input fields
for native POST submissions (e.g. with Next.js Server Actions). This avoids
confusion where inputs may otherwise be omitted from formData.

closes https://github.com/TanStack/form/issues/1565
---
 docs/framework/react/guides/ssr.md                              | 2 +-
 examples/react/next-server-actions/src/app/client-component.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/docs/framework/react/guides/ssr.md b/docs/framework/react/guides/ssr.md
index 6b18a8460..78c33d721 100644
--- a/docs/framework/react/guides/ssr.md
+++ b/docs/framework/react/guides/ssr.md
@@ -293,7 +293,7 @@ export const ClientComp = () => {
           return (
             <div>
               <input
-                name="age"
+                name="age" // must explicitly set the name attribute for the POST request
                 type="number"
                 value={field.state.value}
                 onChange={(e) => field.handleChange(e.target.valueAsNumber)}
diff --git a/examples/react/next-server-actions/src/app/client-component.tsx b/examples/react/next-server-actions/src/app/client-component.tsx
index b7e62909c..e0a3f467b 100644
--- a/examples/react/next-server-actions/src/app/client-component.tsx
+++ b/examples/react/next-server-actions/src/app/client-component.tsx
@@ -37,7 +37,7 @@ export const ClientComp = () => {
           return (
             <div>
               <input
-                name="age"
+                name="age" // must explicitly set the name attribute for the POST request
                 type="number"
                 value={field.state.value}
                 onChange={(e) => field.handleChange(e.target.valueAsNumber)}