Conversation
zod/app/routes/products.tsx
Outdated
| onChange={(event) => { | ||
| submit(event.currentTarget.form); | ||
| }} |
There was a problem hiding this comment.
Since you're submitting the whole form, this can be done on the Form itself
There was a problem hiding this comment.
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.
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.
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, |
2 participants
Adds two routes using Zod for validating and transforming POST request payload and GET request query parameters on server-side.