From fcf08ed687c8256914073f2fda68e96b462e63af Mon Sep 17 00:00:00 2001
From: Cyperghost <olaf_schmitz_1@t-online.de>
Date: Mon, 2 Dec 2024 10:02:57 +0100
Subject: [PATCH] Use `JSON.parse()` instead of `eval()`.

---
 .../templates/radioButtonOptionType.tpl       |  2 +-
 .../templates/selectOptionType.tpl            |  2 +-
 .../templates/shared_booleanOptionType.tpl    |  4 +-
 .../shared_booleanSearchableOptionType.tpl    |  4 +-
 .../templates/shared_checkboxesOptionType.tpl |  2 +-
 ...shared_radioButtonSearchableOptionType.tpl |  2 +-
 .../Core/Component/Option/Enable.ts           | 45 ++++++++++++++-----
 .../acp/templates/radioButtonOptionType.tpl   |  2 +-
 .../files/acp/templates/selectOptionType.tpl  |  4 +-
 .../acp/templates/userEmailAddressExport.tpl  |  4 +-
 .../templates/userGroupBooleanOptionType.tpl  |  6 +--
 .../Core/Component/Option/Enable.js           | 40 ++++++++++++-----
 .../files/lib/data/option/Option.class.php    |  4 +-
 .../option/CaptchaSelectOptionType.class.php  |  4 +-
 .../system/option/SelectOptionType.class.php  |  4 +-
 15 files changed, 83 insertions(+), 46 deletions(-)

diff --git a/com.woltlab.wcf/templates/radioButtonOptionType.tpl b/com.woltlab.wcf/templates/radioButtonOptionType.tpl
index 87e2e637ae..21a53727b6 100644
--- a/com.woltlab.wcf/templates/radioButtonOptionType.tpl
+++ b/com.woltlab.wcf/templates/radioButtonOptionType.tpl
@@ -1,3 +1,3 @@
 {foreach name=radioButtons from=$selectOptions key=key item=selectOption}
-	<label><input {if $tpl.foreach.radioButtons.first}id="{$option->optionName}" {/if}type="radio" name="values[{$option->optionName}]" value="{$key}" {if $value == $key} checked{/if} {if $disableOptions[$key]|isset || $enableOptions[$key]|isset}class="jsEnablesOptions" data-disable-options="[ {@$disableOptions[$key]}]" data-enable-options="[ {@$enableOptions[$key]}]"{/if}> {lang}{@$selectOption}{/lang}</label>
+	<label><input {if $tpl.foreach.radioButtons.first}id="{$option->optionName}" {/if}type="radio" name="values[{$option->optionName}]" value="{$key}" {if $value == $key} checked{/if} {if $disableOptions[$key]|isset || $enableOptions[$key]|isset}class="jsEnablesOptions" data-disable-options="[ {$disableOptions[$key]}]" data-enable-options="[ {$enableOptions[$key]}]"{/if}> {lang}{@$selectOption}{/lang}</label>
 {/foreach}
diff --git a/com.woltlab.wcf/templates/selectOptionType.tpl b/com.woltlab.wcf/templates/selectOptionType.tpl
index 9d325fa1b1..7529516b61 100644
--- a/com.woltlab.wcf/templates/selectOptionType.tpl
+++ b/com.woltlab.wcf/templates/selectOptionType.tpl
@@ -1,4 +1,4 @@
-<select id="{$option->optionName}" name="values[{$option->optionName}]"{if $option->required} required{/if}{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {@$disableOptions}]" data-enable-options="[ {@$enableOptions}]"{/if}>
+<select id="{$option->optionName}" name="values[{$option->optionName}]"{if $option->required} required{/if}{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {$disableOptions}]" data-enable-options="[ {$enableOptions}]"{/if}>
 	{if !$allowEmptyValue|empty}<option value="">{lang}wcf.global.noSelection{/lang}</option>{/if}
 	{foreach from=$selectOptions key=key item=selectOption}
 		<option value="{$key}"{if $value == $key} selected{/if}>{lang}{@$selectOption}{/lang}</option>
diff --git a/com.woltlab.wcf/templates/shared_booleanOptionType.tpl b/com.woltlab.wcf/templates/shared_booleanOptionType.tpl
index 54a9581aa8..21818bfead 100644
--- a/com.woltlab.wcf/templates/shared_booleanOptionType.tpl
+++ b/com.woltlab.wcf/templates/shared_booleanOptionType.tpl
@@ -1,10 +1,10 @@
 <ol class="flexibleButtonGroup optionTypeBoolean">
 	<li>
-		<input type="radio" id="{$option->optionName}"{if $value == 1} checked{/if} name="values[{$option->optionName}]" value="1"{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {@$disableOptions}]" data-enable-options="[ {@$enableOptions}]"{/if}>
+		<input type="radio" id="{$option->optionName}"{if $value == 1} checked{/if} name="values[{$option->optionName}]" value="1"{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {$disableOptions}]" data-enable-options="[ {$enableOptions}]"{/if}>
 		<label for="{$option->optionName}" class="green">{icon name='check'} {lang}wcf.acp.option.type.boolean.yes{/lang}</label>
 	</li>
 	<li>
-		<input type="radio" id="{$option->optionName}_no"{if $value == 0} checked{/if} name="values[{$option->optionName}]" value="0"{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {@$disableOptions}]" data-enable-options="[ {@$enableOptions}]"{/if}>
+		<input type="radio" id="{$option->optionName}_no"{if $value == 0} checked{/if} name="values[{$option->optionName}]" value="0"{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {$disableOptions}]" data-enable-options="[ {$enableOptions}]"{/if}>
 		<label for="{$option->optionName}_no" class="red">{icon name='xmark'} {lang}wcf.acp.option.type.boolean.no{/lang}</label>
 	</li>
 </ol>
diff --git a/com.woltlab.wcf/templates/shared_booleanSearchableOptionType.tpl b/com.woltlab.wcf/templates/shared_booleanSearchableOptionType.tpl
index 6e76182fae..444649675f 100644
--- a/com.woltlab.wcf/templates/shared_booleanSearchableOptionType.tpl
+++ b/com.woltlab.wcf/templates/shared_booleanSearchableOptionType.tpl
@@ -1,11 +1,11 @@
 <label><input type="checkbox" id="search_{$option->optionName}" name="searchOptions[{$option->optionName}]"{if $searchOption} checked{/if}> {lang}wcf.user.option.searchBooleanOption{/lang}</label>
 <ol class="flexibleButtonGroup optionTypeBoolean">
 	<li>
-		<input type="radio" id="{$option->optionName}"{if $value == 1} checked{/if} name="values[{$option->optionName}]" value="1"{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {@$disableOptions}]" data-enable-options="[ {@$enableOptions}]"{/if}{if !$searchOption} disabled{/if}>
+		<input type="radio" id="{$option->optionName}"{if $value == 1} checked{/if} name="values[{$option->optionName}]" value="1"{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {$disableOptions}]" data-enable-options="[ {$enableOptions}]"{/if}{if !$searchOption} disabled{/if}>
 		<label for="{$option->optionName}" class="green">{icon name='check'} {lang}wcf.acp.option.type.boolean.yes{/lang}</label>
 	</li>
 	<li>
-		<input type="radio" id="{$option->optionName}_no"{if $value == 0} checked{/if} name="values[{$option->optionName}]" value="0"{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {@$disableOptions}]" data-enable-options="[ {@$enableOptions}]"{/if}{if !$searchOption} disabled{/if}>
+		<input type="radio" id="{$option->optionName}_no"{if $value == 0} checked{/if} name="values[{$option->optionName}]" value="0"{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {$disableOptions}]" data-enable-options="[ {$enableOptions}]"{/if}{if !$searchOption} disabled{/if}>
 		<label for="{$option->optionName}_no" class="red">{icon name='xmark'} {lang}wcf.acp.option.type.boolean.no{/lang}</label>
 	</li>
 </ol>
diff --git a/com.woltlab.wcf/templates/shared_checkboxesOptionType.tpl b/com.woltlab.wcf/templates/shared_checkboxesOptionType.tpl
index cc90e693d0..57dcf08e45 100644
--- a/com.woltlab.wcf/templates/shared_checkboxesOptionType.tpl
+++ b/com.woltlab.wcf/templates/shared_checkboxesOptionType.tpl
@@ -1,3 +1,3 @@
 {foreach from=$selectOptions key=key item=selectOption}
-	<label><input type="checkbox" name="values[{$option->optionName}][]" value="{$key}" {if $key|in_array:$value} checked{/if} {if $disableOptions[$key]|isset || $enableOptions[$key]|isset}class="jsEnablesOptions" data-disable-options="[ {@$disableOptions[$key]}]" data-enable-options="[ {@$enableOptions[$key]}]"{/if}> {lang}{@$selectOption}{/lang}</label>
+	<label><input type="checkbox" name="values[{$option->optionName}][]" value="{$key}" {if $key|in_array:$value} checked{/if} {if $disableOptions[$key]|isset || $enableOptions[$key]|isset}class="jsEnablesOptions" data-disable-options="[ {$disableOptions[$key]}]" data-enable-options="[ {$enableOptions[$key]}]"{/if}> {lang}{@$selectOption}{/lang}</label>
 {/foreach}
diff --git a/com.woltlab.wcf/templates/shared_radioButtonSearchableOptionType.tpl b/com.woltlab.wcf/templates/shared_radioButtonSearchableOptionType.tpl
index 893447a902..699751c0e2 100644
--- a/com.woltlab.wcf/templates/shared_radioButtonSearchableOptionType.tpl
+++ b/com.woltlab.wcf/templates/shared_radioButtonSearchableOptionType.tpl
@@ -1,6 +1,6 @@
 <label><input type="checkbox" id="search_{$option->optionName}" name="searchOptions[{$option->optionName}]"{if $searchOption} checked{/if}> {lang}wcf.user.option.searchRadioButtonOption{/lang}</label>
 {foreach from=$selectOptions key=key item=selectOption}
-	<label><input type="radio" name="values[{$option->optionName}]" value="{$key}" {if $value == $key} checked{/if} {if $disableOptions[$key]|isset || $enableOptions[$key]|isset}class="jsEnablesOptions" data-disable-options="[ {@$disableOptions[$key]}]" data-enable-options="[ {@$enableOptions[$key]}]"{/if}{if !$searchOption} disabled{/if}> {lang}{@$selectOption}{/lang}</label>
+	<label><input type="radio" name="values[{$option->optionName}]" value="{$key}" {if $value == $key} checked{/if} {if $disableOptions[$key]|isset || $enableOptions[$key]|isset}class="jsEnablesOptions" data-disable-options="[ {$disableOptions[$key]}]" data-enable-options="[ {$enableOptions[$key]}]"{/if}{if !$searchOption} disabled{/if}> {lang}{@$selectOption}{/lang}</label>
 {/foreach}
 
 <script data-relocate="true">
diff --git a/ts/WoltLabSuite/Core/Component/Option/Enable.ts b/ts/WoltLabSuite/Core/Component/Option/Enable.ts
index c9140477f2..6d5572f438 100644
--- a/ts/WoltLabSuite/Core/Component/Option/Enable.ts
+++ b/ts/WoltLabSuite/Core/Component/Option/Enable.ts
@@ -9,9 +9,14 @@
 
 import { wheneverFirstSeen } from "WoltLabSuite/Core/Helper/Selector";
 
+type SelectOption = {
+  value: string;
+  option: string;
+};
+
 function change(option: HTMLInputElement | HTMLSelectElement) {
-  const disableOptions = eval(option.dataset.disableOptions!);
-  const enableOptions = eval(option.dataset.enableOptions!);
+  const disableOptions = JSON.parse(option.dataset.disableOptions!);
+  const enableOptions = JSON.parse(option.dataset.enableOptions!);
 
   if (option instanceof HTMLInputElement) {
     switch (option.type) {
@@ -22,7 +27,7 @@ function change(option: HTMLInputElement | HTMLSelectElement) {
       case "radio":
         if (option.checked) {
           let isActive = true;
-          if (option.dataset.isBoolean && option.value != "1") {
+          if (option.dataset.isBoolean && option.value !== "1") {
             isActive = false;
           }
           showOptions(isActive, disableOptions, enableOptions);
@@ -31,13 +36,24 @@ function change(option: HTMLInputElement | HTMLSelectElement) {
     }
   } else if (option instanceof HTMLSelectElement) {
     const value = option.value;
-    const relevantDisableOptions: string[] = disableOptions
-      .filter((item) => item.value == value)
-      .map((item) => item.option);
+    const relevantDisableOptions: string[] = [];
+    const relevantEnableOptions: string[] = [];
 
-    const relevantEnableOptions: string[] = enableOptions
-      .filter((item) => item.value == value)
-      .map((item) => item.option);
+    for (const item of disableOptions as SelectOption[]) {
+      if (item.value === value) {
+        relevantDisableOptions.push(item.option);
+      } else {
+        relevantEnableOptions.push(item.option);
+      }
+    }
+
+    for (const item of enableOptions as SelectOption[]) {
+      if (item.value === value) {
+        relevantEnableOptions.push(item.option);
+      } else {
+        relevantDisableOptions.push(item.option);
+      }
+    }
 
     showOptions(true, relevantDisableOptions, relevantEnableOptions);
   }
@@ -84,11 +100,16 @@ function enableOption(element: HTMLElement, enable: boolean) {
       noElement.disabled = !enable;
 
       const neverElement = document.getElementById(elementId + "_never") as HTMLInputElement;
-      neverElement.disabled = !enable;
+      if (neverElement) {
+        neverElement.disabled = !enable;
+      }
     }
   } else {
-    if (enable) element.removeAttribute("readonly");
-    else element.setAttribute("readonly", "true");
+    if (enable) {
+      element.removeAttribute("readonly");
+    } else {
+      element.setAttribute("readonly", "true");
+    }
   }
 
   if (enable) {
diff --git a/wcfsetup/install/files/acp/templates/radioButtonOptionType.tpl b/wcfsetup/install/files/acp/templates/radioButtonOptionType.tpl
index 2ec3f82186..97ab266d39 100644
--- a/wcfsetup/install/files/acp/templates/radioButtonOptionType.tpl
+++ b/wcfsetup/install/files/acp/templates/radioButtonOptionType.tpl
@@ -1,3 +1,3 @@
 {foreach from=$selectOptions key=key item=selectOption}
-	<label><input type="radio" name="values[{$option->optionName}]" value="{$key}" {if $value == $key} checked{/if} {if $disableOptions[$key]|isset || $enableOptions[$key]|isset}class="jsEnablesOptions" data-disable-options="[ {@$disableOptions[$key]}]" data-enable-options="[ {@$enableOptions[$key]}]"{/if}> {lang}{@$selectOption}{/lang}</label>
+	<label><input type="radio" name="values[{$option->optionName}]" value="{$key}" {if $value == $key} checked{/if} {if $disableOptions[$key]|isset || $enableOptions[$key]|isset}class="jsEnablesOptions" data-disable-options="[ {$disableOptions[$key]}]" data-enable-options="[ {$enableOptions[$key]}]"{/if}> {lang}{@$selectOption}{/lang}</label>
 {/foreach}
diff --git a/wcfsetup/install/files/acp/templates/selectOptionType.tpl b/wcfsetup/install/files/acp/templates/selectOptionType.tpl
index 9343d83c47..60dc8b423d 100644
--- a/wcfsetup/install/files/acp/templates/selectOptionType.tpl
+++ b/wcfsetup/install/files/acp/templates/selectOptionType.tpl
@@ -1,6 +1,6 @@
-<select id="{$option->optionName}" name="values[{$option->optionName}]"{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {@$disableOptions}]" data-enable-options="[ {@$enableOptions}]"{/if}>
+<select id="{$option->optionName}" name="values[{$option->optionName}]"{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {$disableOptions}]" data-enable-options="[ {$enableOptions}]"{/if}>
 	{if !$allowEmptyValue|empty}<option value="">{lang}wcf.global.noSelection{/lang}</option>{/if}
 	{foreach from=$selectOptions key=key item=selectOption}
 		<option value="{$key}"{if $value == $key} selected{/if}>{lang}{@$selectOption}{/lang}</option>
 	{/foreach}
-</select>
\ No newline at end of file
+</select>
diff --git a/wcfsetup/install/files/acp/templates/userEmailAddressExport.tpl b/wcfsetup/install/files/acp/templates/userEmailAddressExport.tpl
index b3dd25313b..b032e246b2 100644
--- a/wcfsetup/install/files/acp/templates/userEmailAddressExport.tpl
+++ b/wcfsetup/install/files/acp/templates/userEmailAddressExport.tpl
@@ -33,8 +33,8 @@
 		<dl>
 			<dt><label>{lang}wcf.acp.user.exportEmailAddress.fileType{/lang}</label></dt>
 			<dd>
-				<label><input type="radio" name="fileType" value="csv" {if $fileType == 'csv'}checked {/if}class="jsEnablesOptions" data-disable-options="[ ]" data-enable-options="[ 'separatorDiv', 'textSeparatorDiv' ]"> {lang}wcf.acp.user.exportEmailAddress.fileType.csv{/lang}</label>
-				<label><input type="radio" class="jsEnablesOptions" name="fileType" value="xml" {if $fileType == 'xml'}checked {/if}data-disable-options="[ 'separatorDiv', 'textSeparatorDiv' ]" data-enable-options="[ ]"> {lang}wcf.acp.user.exportEmailAddress.fileType.xml{/lang}</label>
+				<label><input type="radio" name="fileType" value="csv" {if $fileType == 'csv'}checked {/if}class="jsEnablesOptions" data-disable-options="[ ]" data-enable-options='[ "separator", "textSeparator" ]'> {lang}wcf.acp.user.exportEmailAddress.fileType.csv{/lang}</label>
+				<label><input type="radio" class="jsEnablesOptions" name="fileType" value="xml" {if $fileType == 'xml'}checked {/if}data-disable-options='[ "separator", "textSeparator" ]' data-enable-options="[ ]"> {lang}wcf.acp.user.exportEmailAddress.fileType.xml{/lang}</label>
 			</dd>
 		</dl>
 		
diff --git a/wcfsetup/install/files/acp/templates/userGroupBooleanOptionType.tpl b/wcfsetup/install/files/acp/templates/userGroupBooleanOptionType.tpl
index 0444dba634..97dcf95509 100644
--- a/wcfsetup/install/files/acp/templates/userGroupBooleanOptionType.tpl
+++ b/wcfsetup/install/files/acp/templates/userGroupBooleanOptionType.tpl
@@ -1,15 +1,15 @@
 <ol class="flexibleButtonGroup optionTypeBoolean">
 	<li>
-		<input type="radio" id="{$option->optionName}"{if $value == 1} checked{/if} name="values[{$option->optionName}]" value="1"{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {@$disableOptions}]" data-enable-options="[ {@$enableOptions}]"{/if}>
+		<input type="radio" id="{$option->optionName}"{if $value == 1} checked{/if} name="values[{$option->optionName}]" value="1"{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {$disableOptions}]" data-enable-options="[ {$enableOptions}]"{/if}>
 		<label for="{$option->optionName}" class="green">{icon name='check'} {lang}wcf.acp.option.type.boolean.yes{/lang}</label>
 	</li>
 	<li>
-		<input type="radio" id="{$option->optionName}_no"{if $value == 0} checked{/if} name="values[{$option->optionName}]" value="0"{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {@$disableOptions}]" data-enable-options="[ {@$enableOptions}]"{/if}>
+		<input type="radio" id="{$option->optionName}_no"{if $value == 0} checked{/if} name="values[{$option->optionName}]" value="0"{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {$disableOptions}]" data-enable-options="[ {$enableOptions}]"{/if}>
 		<label for="{$option->optionName}_no" class="red">{icon name='xmark'} {lang}wcf.acp.option.type.boolean.no{/lang}</label>
 	</li>
 	{if !$option->optionName|str_starts_with:'admin.' && ($group === null || (!$group->isEveryone() && !$group->isUsers()))}
 		<li>
-			<input type="radio" id="{$option->optionName}_never"{if $value == -1} checked{/if} name="values[{$option->optionName}]" value="-1"{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {@$disableOptions}]" data-enable-options="[ {@$enableOptions}]"{/if}>
+			<input type="radio" id="{$option->optionName}_never"{if $value == -1} checked{/if} name="values[{$option->optionName}]" value="-1"{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {$disableOptions}]" data-enable-options="[ {$enableOptions}]"{/if}>
 			<label for="{$option->optionName}_never" class="yellow">{icon name='ban'} {lang}wcf.acp.option.type.boolean.never{/lang}</label>
 		</li>
 	{/if}
diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Option/Enable.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Option/Enable.js
index e35ef19ccd..275c329c76 100644
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Option/Enable.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Option/Enable.js
@@ -11,8 +11,8 @@ define(["require", "exports", "WoltLabSuite/Core/Helper/Selector"], function (re
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.setup = setup;
     function change(option) {
-        const disableOptions = eval(option.dataset.disableOptions);
-        const enableOptions = eval(option.dataset.enableOptions);
+        const disableOptions = JSON.parse(option.dataset.disableOptions);
+        const enableOptions = JSON.parse(option.dataset.enableOptions);
         if (option instanceof HTMLInputElement) {
             switch (option.type) {
                 case "checkbox":
@@ -21,7 +21,7 @@ define(["require", "exports", "WoltLabSuite/Core/Helper/Selector"], function (re
                 case "radio":
                     if (option.checked) {
                         let isActive = true;
-                        if (option.dataset.isBoolean && option.value != "1") {
+                        if (option.dataset.isBoolean && option.value !== "1") {
                             isActive = false;
                         }
                         showOptions(isActive, disableOptions, enableOptions);
@@ -31,12 +31,24 @@ define(["require", "exports", "WoltLabSuite/Core/Helper/Selector"], function (re
         }
         else if (option instanceof HTMLSelectElement) {
             const value = option.value;
-            const relevantDisableOptions = disableOptions
-                .filter((item) => item.value == value)
-                .map((item) => item.option);
-            const relevantEnableOptions = enableOptions
-                .filter((item) => item.value == value)
-                .map((item) => item.option);
+            const relevantDisableOptions = [];
+            const relevantEnableOptions = [];
+            for (const item of disableOptions) {
+                if (item.value === value) {
+                    relevantDisableOptions.push(item.option);
+                }
+                else {
+                    relevantEnableOptions.push(item.option);
+                }
+            }
+            for (const item of enableOptions) {
+                if (item.value === value) {
+                    relevantEnableOptions.push(item.option);
+                }
+                else {
+                    relevantDisableOptions.push(item.option);
+                }
+            }
             showOptions(true, relevantDisableOptions, relevantEnableOptions);
         }
     }
@@ -76,14 +88,18 @@ define(["require", "exports", "WoltLabSuite/Core/Helper/Selector"], function (re
                 const noElement = document.getElementById(elementId + "_no");
                 noElement.disabled = !enable;
                 const neverElement = document.getElementById(elementId + "_never");
-                neverElement.disabled = !enable;
+                if (neverElement) {
+                    neverElement.disabled = !enable;
+                }
             }
         }
         else {
-            if (enable)
+            if (enable) {
                 element.removeAttribute("readonly");
-            else
+            }
+            else {
                 element.setAttribute("readonly", "true");
+            }
         }
         if (enable) {
             element.closest("dl")?.classList.remove("disabled");
diff --git a/wcfsetup/install/files/lib/data/option/Option.class.php b/wcfsetup/install/files/lib/data/option/Option.class.php
index ffa7d43c9f..88e5562113 100644
--- a/wcfsetup/install/files/lib/data/option/Option.class.php
+++ b/wcfsetup/install/files/lib/data/option/Option.class.php
@@ -119,12 +119,12 @@ class Option extends DatabaseObject
                     if (!empty($disableOptions)) {
                         $disableOptions .= ',';
                     }
-                    $disableOptions .= "'" . \mb_substr($item, 1) . "' ";
+                    $disableOptions .= '"' . \mb_substr($item, 1) . '" ';
                 } else {
                     if (!empty($enableOptions)) {
                         $enableOptions .= ',';
                     }
-                    $enableOptions .= "'" . $item . "' ";
+                    $enableOptions .= '"' . $item . '" ';
                 }
             }
         }
diff --git a/wcfsetup/install/files/lib/system/option/CaptchaSelectOptionType.class.php b/wcfsetup/install/files/lib/system/option/CaptchaSelectOptionType.class.php
index 120282cf19..2b4822e89d 100644
--- a/wcfsetup/install/files/lib/system/option/CaptchaSelectOptionType.class.php
+++ b/wcfsetup/install/files/lib/system/option/CaptchaSelectOptionType.class.php
@@ -65,12 +65,12 @@ class CaptchaSelectOptionType extends AbstractOptionType
                         if (!empty($disableOptions)) {
                             $disableOptions .= ',';
                         }
-                        $disableOptions .= "{ value: '" . $key . "', option: '" . \mb_substr($item, 1) . "' }";
+                        $disableOptions .= '{ "value": "' . $key . '", "option": "' . \mb_substr($item, 1) . '" }';
                     } else {
                         if (!empty($enableOptions)) {
                             $enableOptions .= ',';
                         }
-                        $enableOptions .= "{ value: '" . $key . "', option: '" . $item . "' }";
+                        $enableOptions .= '{ "value": "' . $key . '", "option": "' . $item . '" }';
                     }
                 }
             }
diff --git a/wcfsetup/install/files/lib/system/option/SelectOptionType.class.php b/wcfsetup/install/files/lib/system/option/SelectOptionType.class.php
index 5ebc506597..248c8ce25c 100644
--- a/wcfsetup/install/files/lib/system/option/SelectOptionType.class.php
+++ b/wcfsetup/install/files/lib/system/option/SelectOptionType.class.php
@@ -77,12 +77,12 @@ class SelectOptionType extends RadioButtonOptionType
                         if (!empty($disableOptions)) {
                             $disableOptions .= ',';
                         }
-                        $disableOptions .= "{ value: '" . $key . "', option: '" . \mb_substr($item, 1) . "' }";
+                        $disableOptions .= '{ "value": "' . $key . '", "option": "' . \mb_substr($item, 1) . '" }';
                     } else {
                         if (!empty($enableOptions)) {
                             $enableOptions .= ',';
                         }
-                        $enableOptions .= "{ value: '" . $key . "', option: '" . $item . "' }";
+                        $enableOptions .= '{ "value": "' . $key . '", "option": "' . $item . '" }';
                     }
                 }
             }
-- 
2.20.1