diff --git a/modules/ppcp-onboarding/assets/js/settings.js b/modules/ppcp-onboarding/assets/js/settings.js
index e2ad199e0..603fd832a 100644
--- a/modules/ppcp-onboarding/assets/js/settings.js
+++ b/modules/ppcp-onboarding/assets/js/settings.js
@@ -59,17 +59,55 @@ const groupToggleSelect = (selector, group) => {
     );
 }
 
+const disableOptions = (sourceSelector, targetSelector) => {
+
+    const source = jQuery(sourceSelector);
+    const target = document.querySelector(targetSelector);
+    if (! target) {
+        return;
+    }
+    const allOptions = Array.from(document.querySelectorAll('select[name="ppcp[disable_cards][]"] option'));
+    const replace = () => {
+        const validOptions = allOptions.filter(
+            (option) => {
+
+                return ! option.selected
+            }
+        );
+        const selectedValidOptions = validOptions.map(
+            (option) => {
+                option = option.cloneNode(true);
+                option.selected = target.querySelector('option[value="' + option.value + '"]') && target.querySelector('option[value="' + option.value + '"]').selected;
+                return option;
+            }
+        );
+        target.innerHTML = '';
+        selectedValidOptions.forEach(
+            (option) => {
+                target.append(option);
+            }
+        );
+    }
+
+    source.on('change',replace);
+    replace();
+}
+
 (() => {
-    document.querySelector('#field-toggle_manual_input').addEventListener(
-        'click',
-        (event) => {
-            event.preventDefault();
-            document.querySelector('#field-toggle_manual_input').style.display = 'none';
-            document.querySelector('#field-merchant_id').style.display = 'table-row';
-            document.querySelector('#field-client_id').style.display = 'table-row';
-            document.querySelector('#field-client_secret').style.display = 'table-row';
-        }
-    )
+    const manualInputToggle = document.querySelector('#field-toggle_manual_input');
+    if (manualInputToggle) {
+        manualInputToggle.addEventListener(
+            'click',
+            (event) => {
+                event.preventDefault();
+                document.querySelector('#field-toggle_manual_input').classList.toggle('show');
+                document.querySelector('#field-merchant_id').classList.toggle('show');
+                document.querySelector('#field-client_id').classList.toggle('show');
+                document.querySelector('#field-client_secret').classList.toggle('show');
+            }
+        )
+    }
+    disableOptions('select[name="ppcp[disable_cards][]"]', 'select[name="ppcp[card_icons][]"]');
 
     groupToggle(
         '#ppcp-button_enabled',