PHP Radio 單選按鈕取值與保持狀態完整實作

核心概念：同名分組、單一值

Radio 按鈕透過相同的 name 屬性形成互斥群組，提交時僅送出被選中的那一個值。PHP 接收到的是標量（字串/數字），而非陣列。

一、基本 HTML 結構

<form method="post">
  <label><input type="radio" name="sex" value="1"> 男</label>
  <label><input type="radio" name="sex" value="2"> 女</label>
  <label><input type="radio" name="sex" value="3"> 不公開</label>
  <button type="submit">送出</button>
</form>

二、PHP 取值

<?php
$sex = $_POST['sex'] ?? $_GET['sex'] ?? null;
// $sex 為 '1'、'2'、'3' 或 null（未選擇）

// 建議：白名單驗證
$allowed = ['1','2','3'];
if (!in_array($sex, $allowed, true)) {
    $sex = null; // 或預設值
}
?>

三、保持預選狀態（回顯）

3.1 基本寫法

<?php
$selected = $_POST['sex'] ?? $_GET['sex'] ?? '1'; // 預設男
$options = ['1' => '男', '2' => '女', '3' => '不公開'];

foreach ($options as $value => $label) {
    $checked = ($value == $selected) ? ' checked' : '';
    echo "<label><input type=\"radio\" name=\"sex\" value=\"$value\"$checked> $label</label> ";
}
?>

3.2 進階：布林/字串值對應

<?php
// 資料庫儲存 'M'/'F'，介面用 'male'/'female'
$map = ['male' => 'M', 'female' => 'F'];
$revMap = array_flip($map); // ['M'=>'male', 'F'=>'female']

$dbValue = 'M'; // 從 DB 讀出
$selected = $revMap[$dbValue] ?? 'male'; // 對應到介面值

$options = ['male' => '男性', 'female' => '女性'];
foreach ($options as $val => $label) {
    $checked = ($val == $selected) ? ' checked' : '';
    echo "<label><input type=\"radio\" name=\"gender\" value=\"$val\"$checked> $label</label> ";
}
?>

四、常見錯誤與修正

五、封裝通用渲染函數

function renderRadioGroup(string $name, array $options, $selected, array $attrs = []): string
{
    $attrStr = '';
    foreach ($attrs as $k => $v) $attrStr .= ' ' . $k . '="' . htmlspecialchars($v) . '"';
    $html = '';
    foreach ($options as $value => $label) {
        $checked = ($value == $selected) ? ' checked' : '';
        $html .= "<label$attrStr><input type=\"radio\" name=\"" . htmlspecialchars($name) . "\" value=\"" . htmlspecialchars($value) . "\"$checked> " . htmlspecialchars($label) . "</label> ";
    }
    return $html;
}

// 使用
$options = ['1' => '男', '2' => '女', '3' => '不公開'];
$selected = $_POST['sex'] ?? '1';
echo renderRadioGroup('sex', $options, $selected, ['class' => 'form-check-input']);

六、資料庫設計建議

• 使用 TINYINT / ENUM('M','F','N') / CHAR(1) 儲存代碼，避免儲存中文。
• 在模型層定義常數映射：const GENDER_MALE = 'M'; 等，避免魔術字串散落。
• 若需擴充（如 LGBTQ+ 選項），直接在映射表新增，前端選單自動同步，資料庫結構無需變動。

七、無障礙與 UX 小撇步

1. 用 <label> 包裹 input，或 for 對應 id，點擊文字即可選取。
2. 群組外包 <fieldset><legend>性別</legend>...</fieldset>，螢幕閱讀器可識別群組語意。
3. 提供「不願透露」選項，尊重用戶隱私。
4. 錯誤訊息掛在群組層級，而非單一選項。

總結

Radio 單選本質簡單：同名分組、單一值提交、鍵值映射預選。掌握「標準化值在後端流轉、介面值只在模板出現」原則，配合白名單驗證與通用渲染函數，即能寫出健壯、可維護的單選邏輯。