Unable to edit time while using inside form

[ujjwal313]

I am using TimePicker inside form but I am unable to change the time only TimePeriod selector is working.

 <FormField
            control={form.control}
            name="startTime"
            render={({ field }) => (
              <FormItem>
                <FormLabel>Start Time</FormLabel>
                <FormControl>
                  <TimePicker date={field.value} setDate={field.onChange} />
                
                </FormControl>
                <FormMessage />
              </FormItem>
            )}
          />

https://github.com/user-attachments/assets/2fc89eeb-c3de-4e19-a17d-06ae8f9b1f79

[mxkaske]

Hard to tell from the code snippet.

Is the name="startTime" correct?

We have published an example with react-hook-form and the calendar button on time.openstatus.dev is being used within a form.

Otherwise, feel free to share a reproducible project where I can dig in.

[ujjwal313]

@mxkaske Yes, the name="startTime" is correct.

I am using the same time-picker-demo-12h.tsx from Docs.

Only difference is I have removed the seconds input field and related ref and I am using the form inside shadcn Dialog.

I will create a reproducible example

[mxkaske]

To be fair, I haven't tested the 12h demo within a form. So this might be checked indeed. Will try to find time over the week.