Have a repeater field show a countdown based on date field within the same repeater/dataset

Ask the community
, ,
1

Hi all

What i have is a few fields for customer data entry that link to a dataset MyDates, this grabs the info entered and places it in MyDates no issue. I have on the page a repeater that shows that member their entries which is just name, event, date etc each time they add a new entry.

example:
Name: Dave
Event: Birthday
Date: 24/08/2024

Name: Bert
Event: Anniversary
Date: 03/10/2024

What i wish to do is have a countdown based off the current system date and the date entry, so in the said repeater it maybe something like the below.
So my countdown would another field underneath each date pulled on the repeater and then be something like…

Name: Dave
Event: Birthday
Date: 24/08/2024
61 Days until this birthday event ( it is this bit i cannot figure out )

Name: Bert
Event: Anniversary
Date: 03/10/2024
101 Days until this anniversary event ( it is this bit i cannot figure out )

How can i achieve this using Velo code?

Thank you in advance
Paul

2

This can be solved depending on how you saved the date in the CMS.

If you have a “Date” Field without “Include time field” selected, the string returned from the collection is in ISO 8601 format without the time.

If you have a “Date” Field with “Include time field” selected, the string returned from the collection uses JavaScript Date Object formatting.

You can then use this time to write some logic to calculate the “time until” by formatting the returned date in the itemData and comparing it to the current system time.

System time can be calculated by creating a new Date object.

Example

let currentDate = new Date();
console.log(currentDate);
3

Hi Thomas,
Thanks for the reply.

I have a “Date” Field without “Include time field” selected.

KR
Paul