Reputation: 1
I got stuck with the serverAction in Next.js 14 with app router. I want to pass directly some information from my server-side page to the server-side action. Or at least I want to find a way to access data in the action, that was previously fetched or "calulated" in the server-side page.tsx
.
My structure:
Let's say I have a dynamic 'page', <somePage>
with a page.tsx
(server side), a somePageClient.tsx
with the client side and an action.ts
- server side.
<somePage>
|- page.tsx
|- somePageClient.tsx
|- action.ts
The page.tsx fetches data and returns the somePageClient component
export default async function SomePage({ searchParams }: { searchParams: { id: string, otherParam: string, anotherParam: string } }) {
let { id, otherParam, anotherParam } = searchParams;
...
// fetchData here
data = ...;
return <somePageClient data={data} abc={anotherParam} />
My somePageClient would look something like this:
'use client';
...
import { sendValues } from "@/app/somePage/actions";
interface SomePageClientProps {
data: {
...
}
abc: string
}
export default function SomePageClient({data, abc}: SomePageClientProps){
...
const [state, formAction] = useFormState(sendValues, initialState);
...
return (
<>
<Form action={formAction} >
<label>Name</label>
<input type={data.type} name={data.name} />
</Form>
</>
);
}
Now my action.ts holds the formAction function
export async function sendValues(
prevState: {
message: string;
},
formData: FormData,
) {
console.log(`Value ${formData.get("This is the big quesstion")} `);
...
}
My problem is, that the page is dynamic, which means in the action, I don't know the name of the formAction properties which I want to get from the formData.
I already tried to at least get the searchParams via the request but this doesn't work in the action. It seems to me that neither the request header nor anything else I could use is accessible here.
So the big question is: How can I get values from the page.tsx
in my action.ts
?
Sorry for the question, maybe it's easy, maybe it's ... but I got really stuck here.
Upvotes: 0
Views: 353