CODEWITHSUNDEEP
next.jsnextui
Mayeenul Islam
Mayeenul Islam

Reputation: 4762

How to achieve NextUI Datetime Picker to dd/mm/yyyy with 12-hour time

NextUI's DateTimePicker displays

mm/dd/yyyy and hh:min am

However, we want to display:

dd/mm/yyyy hh:min am

We can achieve this with en-GB as a NextUI locale:

import { DatePicker, NextUIProvider } from "@nextui-org/react";

<NextUIProvider locale="en-GB">
    <DatePicker hideTimeZone showMonthAndYearPickers />
</NextUIProvider>

But with en-GB the timepicker is getting 24-hour like

dd/mm/yyyy HH:min

How can we solve this?

Upvotes: 0

Views: 84

Answers (1)

Mayeenul Islam
Mayeenul Islam

Reputation: 4762

We faced this issue, and found that using en-US working for the 12-hour timepicker, however the date format is getting mm/dd/yyyy.

So, we fallback into Indian format, using en-IN:

import { DatePicker, NextUIProvider } from "@nextui-org/react";

<NextUIProvider locale="en-IN">
    <DatePicker hideTimeZone showMonthAndYearPickers />
</NextUIProvider>

Upvotes: 0

Related Questions