Comments (14)
If you set options.dataType = 'json'
, the actual content of $form
will be posted. But if you haven't set it, it will, according to the html standard, post the fields in the <form>
element. So I suspect that you compose the values to $form
, but they are not reflected in the form fields.
from sveltekit-superforms.
Wow! Hero!
from sveltekit-superforms.
Sorry to come back... I am now facing a small other issue :-)
I am calculation a formid value. I am now using:
const { form, errors, constraints, enhance } = superForm(data.form, {
dataType: 'json',
onSubmit(input) {
$form.formid = getFormId();
}
});
this works fine. But because I want to use this everywhere, I thought I could make a generic function:
import { superForm } from 'sveltekit-superforms/client';
import type { AnyZodObject } from 'zod';
export function hSuperForm<T extends AnyZodObject>(
...params: Parameters<typeof superForm<T>>
) {
return superForm(params[0], {
// Your defaults here
dataType: 'json',
onSubmit(input) {
$form.formid = getFormId();
},
...params[1]
});
}
of course this does not work as $form.formid
is not known.
Any suggestion to be able to add a generic way of adding a property formid
here?
from sveltekit-superforms.
In that case, maybe you can extend from the schema that contains the formid
field, that all other schemas should derive from?
hSuperForm<T extends typeof formIdSchema>
(Just a sidenote that you already know probably: dataType = 'json'
makes javascript a requirement.)
from sveltekit-superforms.
Okay, that's a good suggestion; but still, how would I set the value from with the hSuperForm
function? Starting from the onSubmit(input)
how can I set this value? I don't see any way to do this?
from sveltekit-superforms.
Ah, now I see that it's onSubmit
. If you just want to post an extra field, add it to the FormData
of the submit event.
onSubmit({data}) {
data.set('formid', getFormId())
}
from sveltekit-superforms.
Check this out for event signature: https://kit.svelte.dev/docs/types#public-types-submitfunction
from sveltekit-superforms.
Well, that's basically what does not work. As from I change the dataType = 'json'
I cannot set any extra fields, or at least it is not added to the object itself.
So I hoped that this would allow me to add the formid
as the property of the formIdSchema
schema.
Now using
const data = await request.formData();
const formid = data.get('formid') as string;
const form = await superValidate(data, schema);
if (!form.valid) {
return fail(400, { form });
}
form.data.formid = formid;
but now I have to repeat code everytime here :-(
Other option is
const { form, errors, constraints, enhance } = hSuperForm(data.form, {
onSubmit(input) {
$form.formid = getFormId();
}
});
in every page.
So just looking for the most optimal way of doing this.
from sveltekit-superforms.
Yes, it cannot be added to the object, since its type doesn't have a formid
field. :) I'd go for the first way you're doing it, but factorize it to a function.
from sveltekit-superforms.
I have now create an wrapper around the superValidate
export async function hSuperValidate<T extends AnyZodObject>(
req: Request,
schema: T,
options?: SuperValidateOptions<T>
): Promise<Validation<T>> {
const data = await req.formData();
const formid = data.get('formid') as string;
const form = await superValidate(data, schema, options);
//@ts-ignore
form.data.formid = formid;
return form;
}
the only dirty thing is the part where I set the formid... of course it's giving me a ts error, but I just ignore it.
from sveltekit-superforms.
I wish I could use a Type instead of AnyZodObject that contains the formid
I am using
export const hFormObject = z.object({
formid: z.string()
});
and then
const schema = hFormObject.extend({
phoneNumber: z.string().min(9),
remember: z.boolean().default(false)
});
as a base for my schema's, but I have no clue how to make this a type I can use.
from sveltekit-superforms.
Doesn't this work?
export async function hSuperValidate<T extends typeof schema> // (or hFormObject)
from sveltekit-superforms.
🤦
yes!
from sveltekit-superforms.
Great, I'll close this then. :)
from sveltekit-superforms.
Related Issues (20)
- Binding to an optional checkbox item via a component field causes an infinite loop in SSR HOT 2
- Trouble using $posted store HOT 3
- Option for posting only tainted fields HOT 1
- Dates become undefined if schema validation produces error in form action HOT 3
- Add possibility to pass options to validation libraries (Valibot) HOT 3
- Circular dependency warning when using @sveltejs/adapter-node HOT 12
- All validation libraries from optional dependencies are installed in dev environment HOT 6
- formFieldProxy: Argument of type 'string' is not assignable to parameter of type 'never' HOT 13
- valibot: schema with nullable fields throws error on submit while equivalent schema in zod does not HOT 3
- Reset initial form data HOT 3
- How to dynamically add and remove text input fields correctly? HOT 1
- Dynamic Default Values? HOT 16
- Installing Superforms Causes Cloudflare Deployment to Fail HOT 7
- New reset-behaviour HOT 18
- Small typo in docs: reference to z despite switching the validation library to Joi HOT 2
- In SPA mode, navigating to a page that triggers a redirect inside `onUpdate` fails silently HOT 1
- TypeError: Cannot read properties of undefined (reading 'defaults') at Module.superValidate HOT 1
- Reverse In and Out type parameter in superForm return type HOT 1
- FormPathLeaves<FormObj, Date> = never HOT 2
- When I build, I am getting a Circular Dependency warning. HOT 5
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from sveltekit-superforms.