metropolitan-bronze•2y ago

Uncaught TypeError date.locale is not a function

I am using ant design TimePicker component on my form. While creating a form it doesn't have a problem but when I am trying to edit and click on edit icon then my edit page crashes with the above mentioned error. My detail page response from API is:

{
  "details": {
    "id": 45,
    "created_by": 3,
    "route": 7,
    "via": [],
    "shift": "N",
    "start_time": "05:00:00",
    "end_time": "08:00:00",
    "price": 232,
    "has_dynamic_price": false,
    "is_cancelled": false,
    "pickup_points": [
      {
        "id": 45,
        "point": 14,
        "time": "5:00 AM"
      },
      {
        "id": 46,
    "point": 3,
    "time": "6:00 AM"
      }
    ],
    "drop_points": [
      {
    "id": 28,
    "point": 11,
    "price": null,
    "time": "8:00 AM"
      }
    ]
  }
}

{
  "details": {
    "id": 45,
    "created_by": 3,
    "route": 7,
    "via": [],
    "shift": "N",
    "start_time": "05:00:00",
    "end_time": "08:00:00",
    "price": 232,
    "has_dynamic_price": false,
    "is_cancelled": false,
    "pickup_points": [
      {
        "id": 45,
        "point": 14,
        "time": "5:00 AM"
      },
      {
        "id": 46,
    "point": 3,
    "time": "6:00 AM"
      }
    ],
    "drop_points": [
      {
    "id": 28,
    "point": 11,
    "price": null,
    "time": "8:00 AM"
      }
    ]
  }
}

And I get the start_time and end_time as string, which TimePicker component cannot convert to dayjs. What can I do to make it work?

1 Reply

firm-tan•2y ago

Hi @dipbazz, You can use getValueProps to convert your value to a DatePicker compatible type like this: https://github.com/refinedev/refine/blob/next/examples/inputs/datePicker/src/pages/posts/edit.tsx#L82-L84

GitHub

refine/edit.tsx at next · refinedev/refine

Build your React-based CRUD applications, without constraints. - refine/edit.tsx at next · refinedev/refine