Granite UI Time Field in AEM Dialog: How to Include Seconds Along with Hours and Minutes

[margaritageg]

I have a requirement to include hours, minutes, and seconds in a time field within a component dialog.

Currently, I’m using the following implementation:

<timeField
        jcr:primaryType="nt:unstructured"
        sling:resourceType="granite/ui/components/coral/foundation/form/datepicker"
        fieldLabel="Select Time"
        name="./myTime"
        required="{Boolean}true"
        type="time"/>

The issue is that this field only allows selection of hours and minutes, but I also need to include seconds.
How can I modify this to support seconds as well?

[Anudeep_Garnepudi]

@margaritageg 
Try using valueFormat property.
https://developer.adobe.com/experience-manager/reference-materials/6-4/granite-ui/api/jcr_root/libs/...

[margaritageg]

@Anudeep_Garnepudi  I have configured the valueFormat , but in the componnet's dialog UI the datepicker shows only hours and minutes instead of hours, minutes, and seconds

[Anudeep_Garnepudi]

@margaritageg  valueFormat is to specify the format in which value has to be saved.
If you want to change the dispaly the use displayedFormat property.

displayedFormat="YYYY-MM-DD HH:mm:ss"

[margaritageg]

@Anudeep_Garnepudi it doesnt work

[kautuk_sahni]

@margaritageg just checking in! Were you able to get this resolved? If one of the replies above helped—whether it completely solved the issue or simply pointed you in the right direction—marking it as accepted can make it much easier for others with the same question to find a solution. And if you found a different way to fix it, sharing your approach would be a great contribution to the community. Your follow-up not only helps close the loop but also ensures others benefit from your experience. Thanks so much for being part of the conversation!