server action && from state && files
when i log the value i get null anyone more familiar with action knows why ???
import { api } from "~/trpc/server";
export default async function ImportPage() {
async function fromAFile(formData: FormData) {
"use server";
console.log(formData.get("file"));
/* const test = await api.events.addEventsFromIcal.mutate({
data: formData.get("file")?.toString() ?? "",
});*/
}
return (
<form action={fromAFile} className="rounded bg-gray-200 px-3 py-1">
<label className="flex flex-row items-center gap-2 text-base text-gray-950">
<span className="w-full">From a file</span>
<input
className="opacity-0"
type="file"
id="file"
accept=".ics"
required
/>
</label>
<button
type="submit"
className="w-full rounded-lg bg-blue-600 p-2 text-black"
>
import
</button>
</form>
);
}
import { api } from "~/trpc/server";
export default async function ImportPage() {
async function fromAFile(formData: FormData) {
"use server";
console.log(formData.get("file"));
/* const test = await api.events.addEventsFromIcal.mutate({
data: formData.get("file")?.toString() ?? "",
});*/
}
return (
<form action={fromAFile} className="rounded bg-gray-200 px-3 py-1">
<label className="flex flex-row items-center gap-2 text-base text-gray-950">
<span className="w-full">From a file</span>
<input
className="opacity-0"
type="file"
id="file"
accept=".ics"
required
/>
</label>
<button
type="submit"
className="w-full rounded-lg bg-blue-600 p-2 text-black"
>
import
</button>
</form>
);
}
1 Reply
Solution
solved use name="file" instead of id