Issue with Date Field Type Mismatch in Collection

Ask the community
, , ,
1

Question:
How can I correctly save and retrieve date values from session storage to avoid type mismatch errors when uploading to a ‘Date and Time’ field in a Wix collection?

Product:
Wix Studio Editor, Velo

What are you trying to achieve:
I aim to save date values from a datepicker to session storage on one page and then retrieve them on another page to upload to a ‘Date and Time’ field in a Wix collection without encountering type mismatch errors.

What have you already tried:

  1. Saving the datepicker value as a formatted string and converting it back to a Date object before adding it to the collection.
  2. Saving the datepicker value as an ISO string using toISOString() and using this string to set the date field in the collection.
  3. Ensuring the collection field type is set to ‘Date’ and that no other code alters the date format before saving

Additional information:
The date value appears in the ISO format in the collection, but it is not recognized as a valid date type, resulting in a type mismatch error. I need guidance on the correct procedure or settings to format and upload date values to my collection successfully.

Here’s the relevant code snippet for saving and retrieving the date values:
Saving Date to Session Storage as ISO String

// Saving the departure date to session storage as an ISO string
if (departureDateValue) {
session.setItem("departureDate", departureDateValue.toISOString());
}

// Saving the return date to session storage as an ISO string
if (returnDateValue) {
session.setItem("returnDate", returnDateValue.toISOString());
}

Retrieving Date from Session Storage and Saving to Collection

// Function to collect order data and save to collection
async function saveOrderDataToCollection() {
// Retrieve the date strings from session storage
let departureDateString = session.getItem("departureDate");
let returnDateString = session.getItem("returnDate");

// Convert the ISO string back to a Date object
let departureDate = departureDateString ? new Date(departureDateString) : null;
let returnDate = returnDateString ? new Date(returnDateString) : null;

// Object to be saved to the collection
let orderData = {
departureDate: departureDate,
returnDate: returnDate
};

// Code to save 'orderData' to the collection goes here
}
2

The data type used in a “Date” collection field depends on whether the “Include time field” is selected or not.

If “Include time field” is selected, you should insert a JavaScript date object.

If “Include time field” is not selected, you should insert a ISO 8601 string.

I wrote about it in more detail in the post below:

3

I really appreciate of your help.

1 Like