diff --git a/app/components/multiple_checked_select_component/multiple_checked_select_component.html.haml b/app/components/multiple_checked_select_component/multiple_checked_select_component.html.haml
index 0984f1c3cd..913c9d8c6c 100644
--- a/app/components/multiple_checked_select_component/multiple_checked_select_component.html.haml
+++ b/app/components/multiple_checked_select_component/multiple_checked_select_component.html.haml
@@ -1,4 +1,4 @@
-.ofn-drop-down.ofn-drop-down-v2{ data: { controller: "multiple-checked-select", "multiple-checked-select-input-name-value": @name } }
+.ofn-drop-down.ofn-drop-down-v2{ data: { controller: "multiple-checked-select" } }
   %div.ofn-drop-down-label{ "data-multiple-checked-select-target": "button" }
     %span{class: "label"}= t('admin.columns')
     %span{ class: "icon-caret-down", "data-multiple-checked-select-target": "caret" }
@@ -8,9 +8,6 @@
     %hr
     %div.menu_items
       - @options.each do |option|
-        - classes = @selected.include?(option[1]) ? "selected" : ""
-        %div.menu_item{ class: classes, "data-multiple-checked-select-target": "option", "data-value": option[1], "data-label": option[0] }
-          %span.check
-          %span.name
-            = option[0]
-  %div{style: "display: none;", "data-multiple-checked-select-target": "inputs"}
+        %div.menu_item{ "data-multiple-checked-select-target": "option", "data-value": option[1], "data-label": option[0] }
+          %input{ type: "checkbox", checked: @selected.include?(option[1]), name: "#{@name}[]", value: option[1] }
+          %label= option[0]
diff --git a/app/webpacker/controllers/multiple_checked_select_controller.js b/app/webpacker/controllers/multiple_checked_select_controller.js
index ddf52ff868..c736d136e8 100644
--- a/app/webpacker/controllers/multiple_checked_select_controller.js
+++ b/app/webpacker/controllers/multiple_checked_select_controller.js
@@ -1,17 +1,10 @@
 import { Controller } from "stimulus";
 
 export default class extends Controller {
-  static targets = ["button", "caret", "options", "option", "inputs", "filter"];
-  static values = { inputName: String };
+  static targets = ["button", "caret", "options", "option", "filter"];
 
   connect() {
     this.buttonTarget.addEventListener("click", this.toggleOptions);
-    this.optionTargets.forEach((option) => {
-      option.addEventListener("click", (e) =>
-        this.selectOption(e, option.dataset.value)
-      );
-    });
-    this.buildInputs();
     document.addEventListener("click", this.closeOptions);
     this.filterTarget.addEventListener("input", this.filterOptions);
   }
@@ -46,24 +39,4 @@ export default class extends Controller {
       this.caretTarget.classList.add("icon-caret-down");
     }
   };
-
-  selectOption = (event, value) => {
-    this.optionTargets
-      .find((option) => option.dataset.value === value)
-      .classList.toggle("selected");
-    this.buildInputs();
-  };
-
-  buildInputs = () => {
-    this.inputsTarget.innerHTML = "";
-    this.optionTargets
-      .filter((option) => option.classList.contains("selected"))
-      .forEach((option) => {
-        const input = document.createElement("input");
-        input.type = "hidden";
-        input.name = this.inputNameValue + "[]";
-        input.value = option.dataset.value;
-        this.inputsTarget.appendChild(input);
-      });
-  };
 }