react hook form with react table

[niralparmar]

Hi all,
how can i integrate one or more react table with react hook form. my data model include array of complex object with multiple fields and nested object.
i should be able to mark it as required if uses has not entered any data in table. i have been looking all over internet but i could find any help.

so i would appreciate if anybody could help me.

[bluebill1049]

do you have a codesandbox for the type of table you are mention above?

[bluebill1049]

i see. i will recommend you do a poc with react-table with react-hook-form first. i have very little Exp with react-table.

[niralparmar]

thanks @bluebill1049 that was the POC :) , since react table is uncontrolled component not sure how i can pass its reference to react hook form.

[bluebill1049]

as long as you can register all those inputs into hook form, that should be fine.

[bluebill1049]

actually why not using both useForm and useFieldArray? you can combine them right? for the table repeat section use FieldArray and the rest questions just use useForm.

[niralparmar]

our table is highly customize and it has inline editing which has all the business logic for eg, cascade dropdown, conditional rendering of fields,search, show/hide column etc. it will take a lot of time to re implement with useFieldArray.

so adding existing table into form make more feasible. just like form is getting data from react-select, is it not possible to get data from react-table and assign it for field?