diff --git a/ayanova/src/components/date-control.vue b/ayanova/src/components/date-control.vue
index eb5c6539..a2117175 100644
--- a/ayanova/src/components/date-control.vue
+++ b/ayanova/src/components/date-control.vue
@@ -9,7 +9,7 @@
                 <v-text-field
                   dense
                   prepend-icon="$ayiCalendarAlt"
-                  :value="dateValue"
+                  :value="readonlyFormat()"
                   :label="label"
                   :rules="rules"
                   readonly
diff --git a/ayanova/src/components/date-time-control.vue b/ayanova/src/components/date-time-control.vue
index eddcdc7b..7b77a237 100644
--- a/ayanova/src/components/date-time-control.vue
+++ b/ayanova/src/components/date-time-control.vue
@@ -10,7 +10,7 @@
                   <v-text-field
                     dense
                     prepend-icon="$ayiCalendarAlt"
-                    :value="dateValue"
+                    :value="readonlyDateFormat()"
                     :label="label"
                     :rules="rules"
                     readonly
@@ -211,6 +211,14 @@ export default {
         this.hour12
       );
     },
+    readonlyDateFormat() {
+      return window.$gz.locale.utcDateToShortDateLocalized(
+        this.value,
+        this.timeZoneName,
+        this.languageName,
+        this.hour12
+      );
+    },
     updateTimeValue(v) {
       this.updateValue(this.dateValue, v);
     },