diff --git a/docs/data/date-pickers/custom-field/CustomReadonlyBehaviorMaterialTextField.js b/docs/data/date-pickers/custom-field/custom-behavior/ReadonlyMaterialTextField.js
similarity index 90%
rename from docs/data/date-pickers/custom-field/CustomReadonlyBehaviorMaterialTextField.js
rename to docs/data/date-pickers/custom-field/custom-behavior/ReadonlyMaterialTextField.js
index 1ba2af7ffd41..9714150e884c 100644
--- a/docs/data/date-pickers/custom-field/CustomReadonlyBehaviorMaterialTextField.js
+++ b/docs/data/date-pickers/custom-field/custom-behavior/ReadonlyMaterialTextField.js
@@ -10,7 +10,7 @@ import TextField from '@mui/material/TextField';
 
 function ReadonlyDateField(props) {
   const { internalProps, forwardedProps } = useSplitFieldProps(props, 'date');
-  const { value, timezone, format } = internalProps;
+  const { value, timezone, format, onOpen } = internalProps;
   const { InputProps, slotProps, slots, ...other } = forwardedProps;
 
   const placeholder = useFieldPlaceholder(internalProps);
@@ -28,6 +28,7 @@ function ReadonlyDateField(props) {
       placeholder={placeholder}
       InputProps={{ ...InputProps, readOnly: true }}
       error={hasValidationError}
+      onClick={onOpen}
     />
   );
 }
@@ -38,7 +39,7 @@ function ReadonlyFieldDatePicker(props) {
   );
 }
 
-export default function CustomReadonlyBehaviorMaterialTextField() {
+export default function ReadonlyMaterialTextField() {
   return (
     <LocalizationProvider dateAdapter={AdapterDayjs}>
       <ReadonlyFieldDatePicker />
diff --git a/docs/data/date-pickers/custom-field/CustomReadonlyBehaviorMaterialTextField.tsx b/docs/data/date-pickers/custom-field/custom-behavior/ReadonlyMaterialTextField.tsx
similarity index 91%
rename from docs/data/date-pickers/custom-field/CustomReadonlyBehaviorMaterialTextField.tsx
rename to docs/data/date-pickers/custom-field/custom-behavior/ReadonlyMaterialTextField.tsx
index b0dff280b893..e55dc5224358 100644
--- a/docs/data/date-pickers/custom-field/CustomReadonlyBehaviorMaterialTextField.tsx
+++ b/docs/data/date-pickers/custom-field/custom-behavior/ReadonlyMaterialTextField.tsx
@@ -10,7 +10,7 @@ import TextField from '@mui/material/TextField';
 
 function ReadonlyDateField(props: DateFieldInPickerProps<Dayjs, false>) {
   const { internalProps, forwardedProps } = useSplitFieldProps(props, 'date');
-  const { value, timezone, format } = internalProps;
+  const { value, timezone, format, onOpen } = internalProps;
   const { InputProps, slotProps, slots, ...other } = forwardedProps;
 
   const placeholder = useFieldPlaceholder(internalProps);
@@ -28,6 +28,7 @@ function ReadonlyDateField(props: DateFieldInPickerProps<Dayjs, false>) {
       placeholder={placeholder}
       InputProps={{ ...InputProps, readOnly: true }}
       error={hasValidationError}
+      onClick={onOpen}
     />
   );
 }
@@ -38,7 +39,7 @@ function ReadonlyFieldDatePicker(props: DatePickerProps<Dayjs>) {
   );
 }
 
-export default function CustomReadonlyBehaviorMaterialTextField() {
+export default function ReadonlyMaterialTextField() {
   return (
     <LocalizationProvider dateAdapter={AdapterDayjs}>
       <ReadonlyFieldDatePicker />
diff --git a/docs/data/date-pickers/custom-field/CustomReadonlyBehaviorMaterialTextField.tsx.preview b/docs/data/date-pickers/custom-field/custom-behavior/ReadonlyMaterialTextField.tsx.preview
similarity index 100%
rename from docs/data/date-pickers/custom-field/CustomReadonlyBehaviorMaterialTextField.tsx.preview
rename to docs/data/date-pickers/custom-field/custom-behavior/ReadonlyMaterialTextField.tsx.preview
diff --git a/docs/data/date-pickers/custom-field/custom-field.md b/docs/data/date-pickers/custom-field/custom-field.md
index 7c25826b1876..20ca0d4c7f0c 100644
--- a/docs/data/date-pickers/custom-field/custom-field.md
+++ b/docs/data/date-pickers/custom-field/custom-field.md
@@ -153,7 +153,7 @@ Learn more about the accessible DOM structure and its difference compared to the
 
 ### Using a read-only `TextField`
 
-{{"demo": "CustomReadonlyBehaviorMaterialTextField.js", "defaultCodeOpen": false}}
+{{"demo": "custom-behavior/ReadonlyMaterialTextField.js", "defaultCodeOpen": false}}
 
 ### Using an `Autocomplete`
 
diff --git a/packages/x-date-pickers/src/hooks/useSplitFieldProps.ts b/packages/x-date-pickers/src/hooks/useSplitFieldProps.ts
index 35a29a7bc094..67bbe25e9d12 100644
--- a/packages/x-date-pickers/src/hooks/useSplitFieldProps.ts
+++ b/packages/x-date-pickers/src/hooks/useSplitFieldProps.ts
@@ -24,6 +24,7 @@ const SHARED_FIELD_INTERNAL_PROP_NAMES = [
   'disabled',
   'readOnly',
   'dateSeparator',
+  'onOpen',
 ] as const;
 
 type InternalPropNames<TValueType extends FieldValueType> =
diff --git a/packages/x-date-pickers/src/internals/hooks/useDesktopPicker/useDesktopPicker.tsx b/packages/x-date-pickers/src/internals/hooks/useDesktopPicker/useDesktopPicker.tsx
index b13a78700e27..673a80006898 100644
--- a/packages/x-date-pickers/src/internals/hooks/useDesktopPicker/useDesktopPicker.tsx
+++ b/packages/x-date-pickers/src/internals/hooks/useDesktopPicker/useDesktopPicker.tsx
@@ -156,6 +156,7 @@ export const useDesktopPicker = <
       timezone,
       label,
       name,
+      onOpen: actions.onOpen,
       autoFocus: autoFocus && !props.open,
       focused: open ? true : undefined,
       ...(inputRef ? { inputRef } : {}),
diff --git a/packages/x-date-pickers/src/internals/models/fields.ts b/packages/x-date-pickers/src/internals/models/fields.ts
index e02b43315f56..032622ed41ce 100644
--- a/packages/x-date-pickers/src/internals/models/fields.ts
+++ b/packages/x-date-pickers/src/internals/models/fields.ts
@@ -18,4 +18,5 @@ export interface BaseFieldProps<
   format?: string;
   disabled?: boolean;
   ref?: React.Ref<HTMLDivElement>;
+  onOpen: (event: React.UIEvent) => void;
 }