-
Notifications
You must be signed in to change notification settings - Fork 236
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat: add zod
example
#328
base: main
Are you sure you want to change the base?
Conversation
zod/app/routes/products.tsx
Outdated
onChange={(event) => { | ||
submit(event.currentTarget.form); | ||
}} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Since you're submitting the whole form, this can be done on the Form
itself
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Initially, I didn't wanted to implement a filter as you type experience for all the form. But I thought, at least for the items per page select, it would be more intuitive for users to have it submitted on change without manually submitting.
If having it on the whole form will be nicer, maybe I should also add some error info to loader data for all the fields in products route, instead of just throwing.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Now that I'm thinking about it, putting the onChange
on the form, would mean it gets submitted on every change, not only of the selection 😕
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes exactly, I added a small onChange handler function for debounced submission and put that on the form itself and added error fields and default values to loader response. I think that became also a nice example for enhancing the ux with javascript. But I'm not sure, if all that additions made this example a little deviate it from its purpose of being just a zod example.
Hi @MichaelDeBoey, |
Adds two routes using Zod for validating and transforming POST request payload and GET request query parameters on server-side.