Simplify your stack and build anything. Or everything.
Build tomorrow’s web with a modern solution you truly own.
Code-based nature means you can build on top of it to power anything.
It’s time to take back your content infrastructure.

Default Value for Date

default discord avatar
kethan_1last year
2

I noticed that the default value for fields of type date is "12/30/1969", even without user input and when required is set to

false

.



This can be removed and the field can be set to empty by clicking the

X

present toward the right hand side of the field.



I was wondering if there was any way the field could be empty by default?



what is looks like after pressing the x button:

  • default discord avatar
    ieva.jaksaitytelast year

    maybe it had some restrictions before, you removed them in payload, but they are still applied inside dabatase (you could check independently from payload, via database itself)



    on the other hand, maybe "default value" would help you:



     {
          name: 'orderDate',
          label: 'Užsakymo data',
          type: 'date',
          required: true,
          defaultValue: new Date().toLocaleString('lt'),
          admin: {
              position: 'sidebar',
              date: {
                  displayFormat: 'yyyy-MM-dd',
              }
          }
    },


    i'm using it to get current date, but maybe something different could be applied with

    defaultValue

    field

  • default discord avatar
    kethan_1last year

    Some date fields do appear as

    NULL

    in the database:



    I believe payload changes

    NULL

    date fields to 0 UTC (1969-12-31) whenever it encounters them, necessitating that the user presses the

    X

    button to revert the field back to NULL.



    Setting defaultValue to

    undefined

    didn't change anything sadly.



    When using

    date.overrides

    to pass the

    selected

    prop as null directly to react-datepicker as such (mentioned here:

    https://payloadcms.com/docs/fields/date#display-format-and-picker-appearance

    ):


    {
      name: "applicationOpens",
      type: "date",
      required: false,
      admin: {
        description: "When the application opens",
        placeholder: "Select a date",
        date: {
          overrides: {
            selected: null,
          }
        },
      },
    },

    The field does appear empty (shown in the attached image).



    Given that the database correctly stores the date as null, and it is not the underlying date picker library (react-datepicker) that is changing the date when encountering null, I believe it must be Payload changing something.



    Just doing some digging around in the Payload codebase. I might be completely off the mark here, just throwing some thoughts out.



    I don't believe it's this file:

    https://github.com/payloadcms/payload/blob/main/packages/ui/src/elements/DatePicker/DatePicker.tsx

    as it only executes

    value && new Date(value),

    , which should evaluate to

    null

    if value is

    null

    And I don't think it's this file either:

    https://github.com/payloadcms/payload/blob/main/packages/ui/src/fields/DateTime/index.tsx

    as it just gets the value form useField



    maybe

    https://github.com/payloadcms/payload/blob/main/packages/ui/src/forms/useField/index.tsx

    ?



    Not too sure what fixed it but this issue seems to be resolved in the latest Payload release.

Star on GitHub

Star

Chat on Discord

Discord

online

Can't find what you're looking for?

Get dedicated engineering support directly from the Payload team.