Best way to combine date fields

[davshoward]

I've got three custom inputs (day, month, year) which I want to combine into a single date field - all within a custom component.

Ideal scenario: <DateInput> component contains three custom <Input> components.

Registered values

• day (e.g. 03)
• month (e.g. 11)
• year (e.g. 2000)

To then submit a new field in the format '2000-11-03'.

What's the best way to achieve this? I've tried a variety of different approaches but none work properly.

[bluebill1049]

use/build a controlled component and wrapped with Controller? i think there are many data type component out there which may suits your need.

[element-software]

I've got three custom inputs (day, month, year) which I want to combine into a single date field - all within a custom component.

Ideal scenario: <DateInput> component contains three custom <Input> components.

Registered values

• day (e.g. 03)
• month (e.g. 11)
• year (e.g. 2000)

To then submit a new field in the format '2000-11-03'.

What's the best way to achieve this? I've tried a variety of different approaches but none work properly.

Currently doing this now. I have achieved it by creating a TextInput component which can have any validation applied to it, and is just a text input. Then build a DateInput component which has 3 TextInput components inside there, using a RHF Controller render method. In the onChange and onBlur handlers you return the value as a new Date() and the form will receive it. Getting the errors to display for each field e.g. if you don't enter a day, is a bit difficult. Hope this helps.