Why not prepopulated value being set as value in Autocomplete Material UI using controller of react-hook-form

0
votes

I am using controller component of react-hook-form to call material UI autocomplete.

When I'm passing defaultValue parameter then it is populating in field but when click on submit button then showing validation error message: enter image description here

shared_with_users must be a `array` type, but the final value was: `null` (cast from the value `{ "value": "571998", "label": "\"Satyendra Kumar\"" }`). If "null" is intended as an empty value be sure to mark the schema as `.nullable()`

Here is my code: https://codesandbox.io/s/nervous-tree-9e2js?file=/src/App.js

Autocomplete is coming after selection of last select box. I am using yup for form validation.

Please suggest the fixes.

Thank you in advance

1
autocompletematerial-uiyupreact-hook-form

1 Answers

0
votes

Issue is fixed now. Problem was uncontrolled component, when i created controlled component then it started working properly.

Here is my updated code:

https://codesandbox.io/s/nervous-tree-9e2js?file=/src/App.js