diff --git a/src/components/NcDateTimePickerNative/NcDateTimePickerNative.vue b/src/components/NcDateTimePickerNative/NcDateTimePickerNative.vue
index 43b451e251..7d1c8f28fe 100644
--- a/src/components/NcDateTimePickerNative/NcDateTimePickerNative.vue
+++ b/src/components/NcDateTimePickerNative/NcDateTimePickerNative.vue
@@ -22,7 +22,6 @@ All available types are: 'date', 'datetime-local', 'month', 'time' and 'week', p
 			<NcSelect v-bind="props" v-model="type" />
 			<NcDateTimePickerNative
 				v-model="value"
-				:id="id"
 				:label="label"
 				:type="type" />
 		</div>
@@ -45,7 +44,6 @@ All available types are: 'date', 'datetime-local', 'month', 'time' and 'week', p
 				},
 				type: 'datetime-local',
 				value: new Date(),
-				id: 'date-time-picker',
 				label: 'Select a new date or time',
 			}
 		},
@@ -66,7 +64,6 @@ All available types are: 'date', 'datetime-local', 'month', 'time' and 'week', p
 		<span>Picked date: {{ value || 'null' }}</span>
 		<NcDateTimePickerNative
 			v-model="value"
-			:id="id"
 			:min="yesterdayDate"
 			:max="someDate"
 			:label="label"
@@ -79,7 +76,6 @@ All available types are: 'date', 'datetime-local', 'month', 'time' and 'week', p
 		data() {
 			return {
 				value: new Date(),
-				id: 'date-time-picker',
 				label: 'Please select a new date',
 				yesterdayDate: new Date(new Date().setDate(new Date().getDate() - 1)),
 				someDate: new Date(new Date().setDate(new Date().getDate() + 7)),
@@ -108,6 +104,7 @@ All available types are: 'date', 'datetime-local', 'month', 'time' and 'week', p
 
 <script>
 import ScopeComponent from '../../utils/ScopeComponent.js'
+import GenRandomId from '../../utils/GenRandomId.js'
 
 const inputDateTypes = ['date', 'datetime-local', 'month', 'time', 'week']
 
@@ -132,7 +129,8 @@ export default ScopeComponent({
 		 */
 		id: {
 			type: String,
-			required: true,
+			default: () => 'date-time-picker-' + GenRandomId(),
+			validator: id => id.trim() !== '',
 		},
 		/**
 		 * type attribute of the input field