diff --git a/Web/scripts/reports/generate-reports.js b/Web/scripts/reports/generate-reports.js
index c5e1adaf5..8749e29df 100644
--- a/Web/scripts/reports/generate-reports.js
+++ b/Web/scripts/reports/generate-reports.js
@@ -24,8 +24,11 @@ function GenerateReports(reportOptions) {
 
         wireUpAutocompleteFilters();
 
-        $('.dateinput').click(function () {
-            $('#range_within').attr('checked', 'checked');
+        document.addEventListener('click', function (e) {
+            if (e.target.matches('.dateinput')) {
+                const radio = document.getElementById('range_within');
+                radio.checked = true;
+            }
         });
 
         $('#btnCustomReport').click(function (e) {
@@ -43,26 +46,7 @@ function GenerateReports(reportOptions) {
 
             ajaxPost(elements.customReportForm, opts.customReportUrl, before, after);
         });
-/*
-        $('#showHideCustom').click(function (e) {
-            e.preventDefault();
-            $('#customReportInput-container').toggle();
-        });
-
-        $(document).on('click', '#btnPrint', function (e) {
-            e.preventDefault();
-
-            var url = opts.printUrl + elements.customReportForm.serialize();
-            window.open(url);
-        });
 
-        $(document).on('click', '#btnCsv', function (e) {
-            e.preventDefault();
-
-            var url = opts.csvUrl + elements.customReportForm.serialize();
-            window.open(url);
-        });
-*/
         elements.saveDialog.on('shown.bs.modal', function () {
             $('#saveReportName').focus();
         });
@@ -119,4 +103,4 @@ function GenerateReports(reportOptions) {
         ajaxPost($('#customReportInput, #saveReportForm'), opts.saveUrl, before, after);
     };
 
-}
\ No newline at end of file
+}
diff --git a/tpl/Reports/generate-report.tpl b/tpl/Reports/generate-report.tpl
index 7fea7d548..585d16865 100644
--- a/tpl/Reports/generate-report.tpl
+++ b/tpl/Reports/generate-report.tpl
@@ -120,14 +120,12 @@
 												class="bi bi-calendar3-range me-1"></i>{translate key=Between}</label>
 
 										<label for="startDate" class="visually-hidden">{translate key=StartDate}</label>
-										<input type="date" class="form-control form-control-sm dateinput inline"
-											id="startDate" autocomplete="off" />
-										-
-										<input type="hidden" id="formattedBeginDate" {formname key=REPORT_START} />
+										<input type="text" class="form-control form-control-sm dateinput w-auto"
+											id="startDate" {formname key=REPORT_START} />
+										<div class='mx-1'>-</div>
 										<label for="endDate" class="visually-hidden">{translate key=EndDate}</label>
-										<input type="date" class="form-control form-control-sm dateinput inline"
-											id="endDate" autocomplete="off" />
-										<input type="hidden" id="formattedEndDate" {formname key=REPORT_END} />
+										<input type="text" class="form-control form-control-sm dateinput w-auto"
+											id="endDate" {formname key=REPORT_END} />
 									</div>
 								</div>
 							</div>
@@ -317,14 +315,11 @@
 		});
 	});
 
-	//$('#report-filter-panel').showHidePanel();
-
-
 	//$('#user-filter, #participant-filter').clearable();
 </script>
 
-{control type="DatePickerSetupControl" ControlId="startDate" AltId="formattedBeginDate"}
-{control type="DatePickerSetupControl" ControlId="endDate" AltId="formattedEndDate"}
+{control type="DatePickerSetupControl" ControlId="startDate"}
+{control type="DatePickerSetupControl" ControlId="endDate"}
 
 </div>
-{include file='globalfooter.tpl'}
\ No newline at end of file
+{include file='globalfooter.tpl'}