diff --git a/app/views/admin/reports/_rendering_options.html.haml b/app/views/admin/reports/_rendering_options.html.haml
index 92cb310b44a3..02a3b5805bde 100644
--- a/app/views/admin/reports/_rendering_options.html.haml
+++ b/app/views/admin/reports/_rendering_options.html.haml
@@ -7,6 +7,14 @@
       .omega.fourteen.columns
         = select_tag(:report_subtype, options_for_select(@report_subtypes, @report_subtype))  
 
+.row.rendering-options{ "data-controller": "csv-header-report" }
+  .alpha.two.columns
+    = label_tag :report_format, t(".generate_report")
+  .omega.fourteen.columns
+    = select_tag :report_format, grouped_options_for_select({ |
+      t('.formatted_data') => { t('.on_screen') => '', "PDF" => 'pdf', t('.spreadsheet') => 'xlsx' }, |
+      t('.raw_data') => { "CSV" => 'csv' }, |
+    }), { "data-csv-header-report-target": "reportType", "data-action": "csv-header-report#handleSelectChange" }
 
 - if @report.header_option? || @report.summary_row_option?
   .row
@@ -33,14 +41,3 @@
       .omega.fourteen.columns
         = select_tag(:fields_to_hide, options_for_select(@report.available_headers, params[:fields_to_hide]),
                     class: "select2 fullwidth", multiple: true)
-
-.row.rendering-options
-  .alpha.two.columns
-    = label_tag :report_format, t(".generate_report")
-  .omega.fourteen.columns
-    = select_tag :report_format, grouped_options_for_select({ |
-      t('.formatted_data') => { t('.on_screen') => '', "PDF" => 'pdf', t('.spreadsheet') => 'xlsx' }, |
-      t('.raw_data') => { "CSV" => 'csv' }, |
-    })
-
-
diff --git a/app/webpacker/controllers/csv_header_report_controller.js b/app/webpacker/controllers/csv_header_report_controller.js
new file mode 100644
index 000000000000..4917c879c715
--- /dev/null
+++ b/app/webpacker/controllers/csv_header_report_controller.js
@@ -0,0 +1,19 @@
+import { Controller } from "stimulus";
+
+export default class extends Controller {
+  static targets = ["reportType"]
+
+  handleSelectChange() {
+    let displayHeaderRow = document.querySelector("#display_header_row");
+    let displayHeaderRowLabel = displayHeaderRow.nextElementSibling;
+
+    if (this.reportTypeTarget.value == "csv") {
+      displayHeaderRow.checked = false;
+      displayHeaderRow.disabled = true;
+      displayHeaderRowLabel.style.color = "#CCCCCC";
+    } else {
+      displayHeaderRow.disabled = false;
+      displayHeaderRowLabel.style.color = "#809CB1";
+    }
+  }
+}