diff --git a/frontend/src/utils/form/datepicker.js b/frontend/src/utils/form/datepicker.js
index fc6b254c1..4891415c2 100644
--- a/frontend/src/utils/form/datepicker.js
+++ b/frontend/src/utils/form/datepicker.js
@@ -149,14 +149,16 @@ export class Datepicker {
     // mark the form input element as initialized
     this._element.classList.add(DATEPICKER_INITIALIZED_CLASS);
 
-    const changeEvent = () => {
-      const parsedDate = moment(this._element.value, FORM_DATE_FORMAT_MOMENT[this.elementType]).toDate();
-      this.datepickerInstance.selectDate(parsedDate);
+    const setDatepickerDate = () => {
+      const parsedMomentDate = moment(this._element.value, FORM_DATE_FORMAT_MOMENT[this.elementType]);
+      if (parsedMomentDate.isValid()) {
+        this.datepickerInstance.selectDate(parsedMomentDate.toDate());
+      }
       // reregister change event to prevent event loop
-      this._element.addEventListener('change', changeEvent, { once: true });
+      this._element.addEventListener('change', setDatepickerDate, { once: true });
     };
     // change the selected date in the tail.datetime instance if the value of the input element is changed
-    this._element.addEventListener('change', changeEvent, { once: true });
+    this._element.addEventListener('change', setDatepickerDate, { once: true });
 
     // close the instance if something other than the instance was clicked (i.e. if the target is not within the datepicker instance and if any previously clicked calendar view was replaced (is not in the window anymore) because it was clicked). YES, I KNOW
     window.addEventListener('click', event => {