Date

An ISO-8601 formatted string containing date. E.g.  2017-02-12.

Properties

  • REQUIREDtypestring

    Required. Value must be set to date.

  • REQUIREDnamestring

    Required. The field name. This will be the key in the data record.

  • titlestring

    Human readable label for the field.

  • hiddenboolean | function

    If set to true, this field will be hidden in the studio. You can also return a callback function to use it as a conditional field.

  • readOnlyboolean | function

    If set to true, this field will not be editable in the content studio. You can also return a callback function to use it as a conditional field.

  • descriptionstring

    Short description to editors how the field is to be used.

  • placeholderstring

    Placeholder text that appear within the input when it is empty.

  • initialValueDateStringOrResolverFunction

    The initial value used when creating new values from this type. Can be either a literal date string value or a resolver function that returns either a literal date string value or a promise resolving to the initial date string value.

  • componentsobject

    Lets you provide custom components to override the studio defaults in various contexts. The components available are field, input, item, preview.

Options

  • dateFormatstring

    Controls how the date input field formats the displayed date. Use any valid Moment format option. Default is YYYY-MM-DD.

Validation

Learn more about validation
  • required()

    Ensures that this field exists.

  • custom(fn)

    Creates a custom validation rule.

  • min(minDate)function

    Minimum date (inclusive). minDate should be in ISO 8601 format.

  • max(maxDate)function

    Maximum date (inclusive). maxDate should be in ISO 8601 format.

The stored date is represented as a string in compliance with ISO 8601 (often described as YYYY-MM-DD).

Protip

If you need to store information about both date and time, use the datetime type instead.

Input

{
  title: 'Release date',
  name: 'releaseDate',
  type: 'date'
}

Output

{
  "releaseDate": "2017-02-12"
}

Example: All options set

{
  title: 'Release date',
  name: 'releaseDate',
  type: 'date',
  options: {
    dateFormat: 'YYYY-MM-DD',
    calendarTodayLabel: 'Today'
  }
}

Was this article helpful?