diff --git a/src/main/frontend/src/components/CreateLoanDialog.tsx b/src/main/frontend/src/components/CreateLoanDialog.tsx
index 51e1bd1..e4254be 100644
--- a/src/main/frontend/src/components/CreateLoanDialog.tsx
+++ b/src/main/frontend/src/components/CreateLoanDialog.tsx
@@ -79,6 +79,8 @@ function CreateLoanDialog() {
         });
     }, []);
 
+    const [calendarDialogOpen, setCalendarDialogOpen] = useState(false);
+
     return (
         <Dialog>
             <DialogTrigger asChild>
@@ -208,6 +210,7 @@ function CreateLoanDialog() {
                                                         "w-[240px] pl-3 text-left font-normal",
                                                         !field.value && "text-muted-foreground"
                                                     )}
+                                                    onClick={() => setCalendarDialogOpen(!calendarDialogOpen)}
                                                 >
                                                     {field.value ? (
                                                         format(field.value, "PPP")
@@ -222,7 +225,10 @@ function CreateLoanDialog() {
                                             <Calendar
                                                 mode="single"
                                                 selected={field.value}
-                                                onSelect={field.onChange}
+                                                onSelect={(date) => {
+                                                    field.onChange(date);
+                                                    setCalendarDialogOpen(false);
+                                                    }}
                                                 disabled={(date) =>
                                                     date > new Date() || date < new Date("1900-01-01")
                                                 }