Date Ranges & Recurring Dates

What would be the recommended way to handle a date range field? I am currently considering two fields (1. Start Date 2. End Date) but these fields are not aware of each other and I’m unsure how to validate that the end date is later than the start date.

Additionally, curious how one might handle recurring dates in Contentful.

Hi Blake!

Date fields just don’t know about each-other so it’s not possible to have such a validation. One approach could be using an UI extension for this, so the extension would have to be aware of the other field, do the validation, and notify the user.

Additionally, curious how one might handle recurring dates in Contentful.

You mean like an event that is happening e.g. every week on a Monday? or an event that happens on two or more specific dates? I guess you could use the Object (json ) field type to model something. Alternatively you could model something using the Array<Link> field type and link to entries of a content type created specifically for this. E.g. each linked entry could represent one date or day of the week.


1 Like

Just in case it is useful for someone in the future, I ended up implementing:

  • Start Date (normal Contentful date field, required)
  • End Date (date field with an App extension)

For custom entry validation, I leveraged two additional fields:

  • Field Validation (JSON field, disabled from editing and response)
  • Validation (Boolean field with an App extension, required, disabled in response)

The End Date UI extension checks the Start Date and if it is greater than the End Date, it sets a property in the Field Validation JSON field for the field ID to false.

The Validation UI extension checks the JSON field for any property/field that is false and if any are, it sets its own value to null, and since it is a required field, it prevents the entry from being saved. This extension does not render an input, just a message indicating the validation status, and if invalid it lists the invalid fields.

Date validation:
Entry validation: