Do you guys have a guide for other types of inputs? It's quite frustrating everyone just shows a simple text field while the most of us in the field have to deal with selects and others. I'm having problems with using Controller with MUI components and there's little to go on.
@@incognito14x2 yeah bro, just do this : const { append, remove, fields } = useFieldArray({ control: form.control, name: "skills" as never, }); and append("")
amazing stuff... i'm creating a form that it is supposed to be loaded with server data, and it allows users to update this data. The summary at the end that needs only the changed fields is giving me a headache, but your videos are helping me a lot. Thanks!
Is there another video that differentiates between the custom errors (non-registered field) and the use of the 'root.' prefix in the error name? It's really not clear from the docs why you wouldn't just always use the use custom error mechanism.
Hello, thank you for the video. I have a question though: I want to have a language set with three select fields with options: first is "Language", second is "Oral Skill for this language" and "Writing skill for this language". However, I want initially only "language" field to appear, and only after selecting a language (i.e. giving it value), I want two other fields to appear. And the append button should become disabled as soon as I added a language, until we selected all three selects. N.B. I can not use onChange or OnValueChange functions. Does it still work because of watch?
Form is a critical component we can develop, i suggest we create our own component rather than trusting somebody's tool, so many alternative we can copy this feature
can you do an example of a complex form that has update and a lot of select values that comes from gql quries? im really lost, im using controller but i think i need something more
Thanks so much Bill. This video solved my issue with a more complex component wrapped in a Controller and passing the value through to ZodResolver as a Number instead of String. Was tearing my hair out before finding this!
I´m using a button to submit to prevent submitting on enter key, but it seems like React Hook Form is still reloading the page, and since I´m just using an onClick event I can´t prevent defaults on it to stop the reload. Any tips?
The speaker should improve on his sound quality. You sound muffled and unenthusiastic. I've had to keep on replaying some parts because the words are getting lost in the muffled sound. For such a popular dev tool, the speaker should speak as though he actually wants to give the tutorial.
4:20 without changing `onChnge:props.onChange` to `onChange: (e)=> props.onChange({target:{name, value:e.target.value})` the form submission functionality doesn't work properly, I test it, but while the `e` object have the target property with same values for `name` and `value` why `onChage:props.onChange` doesn't work? (I see that if we have ability for dirctlly spreading `register` return properties on a HTML input element some how because of passed `ref` the calling onChange(e) does the job, but ...)
I could make the setValue works with an onChange inside the register method, and the input is correct visually with the new setValue, however, when I submit the data seems one state before my onChange setValue function. Im trying to understand but cant find the reason. also tried the setValueAs: v => {...}, the value on the v argument is correct when I do a console.log, but when I return v and also do a submit, the data again seems one state before my onChange any reasons? thanks
I can't get past 30 seconds into this tutorial. I started a new React + vite app, added a single "form" component with two inputs, and as soon as I try to use the useForm hook, my console is full of errors. I have nothing else in this app, but it says I have invalid hook call and dispatcher is null. I have no way of understanding these errors in context or debugging them. I dunno what to do when I can't follow the very first step of the tutorial
Wonderful product! Just wondering, are there any plans on making this an open source product that people can self-host? It'd be amazing to have alternatives to things such as SurveyJS!
Hey I am using rhf with yup. Now I make input components using controller and useFormContext and use that component using FormProvider. Now I want some validation in component level and some validation in page level. So How can I do that.? And I am using mantine UI.
