Bootstrap表单提交仅默认单选按钮传值，其余输入字段未发送至create.php

结合HTML表单提交规则和Bootstrap表单的常见踩坑场景，出现“仅radio单选字段能被PHP $_POST接收、其他字段全部丢失”的现象，基本不存在后端配置问题，所有诱因都出在前端表单的配置或者结构上：

• 最高概率：除radio组之外的所有表单控件，都缺失了非空的name属性
  浏览器序列化POST表单数据的核心规则是：只有带有效name属性的控件才会被纳入提交队列。很多人抄Bootstrap官方表单模板的时候，会给text、email、password、select、checkbox这类控件只加id属性做样式关联，漏掉核心的name配置；反而radio组因为是单选互斥逻辑，怕写出来实现不了功能，顺手补上了name="fur_length"这类属性，最终就出现了只有radio能被提交的情况。
• 次高概率：非radio的所有控件都被错误加上了disabled属性
  和readonly属性不同，disabled标记的表单控件会完全被浏览器排除在提交队列之外。常见的触发场景包括：抄模板的时候把占位用的disabled属性忘了删；引入的Bootstrap表单校验插件配置错误，在提交前没有给未校验通过的字段移除disabled标记，恰好radio组没有被插件拦截，所以能正常提交。
• 第三类常见问题：DOM结构错位，非radio的所有控件都被放到了<form>标签的包裹范围外
  用Bootstrap栅格布局拆分表单结构的时候，很容易因为写闭合标签粗心，把</form>的位置提前，导致前面写的输入框、下拉框、复选框都落在form标签外面，只有后续写的radio组刚好在form的包裹范围内，自然只有这部分数据会被提交。
• 低概率问题：前端自定义提交逻辑的选择器错误
  如果引入了自定义JS做表单提交拦截，要检查序列化表单的选择器是不是写错了——比如只选中了radio所在的容器节点，没把其他输入框的节点纳入序列化范围，导致其他字段没被拼接到POST请求体里。

• 打开浏览器开发者工具（F12），切换到「元素」面板，挨个检查每个输入框、下拉框、复选框的属性：确认每个控件都有非空的name属性，且没有被加上disabled标记
• 核对DOM层级，从<form>标签开始逐层级展开，确认所有需要提交的控件都在</form>闭合标签之前，没有被排除在包裹范围外
• 切换到开发者工具的「网络」面板，勾选「保留日志」，提交一次表单后找到发往create.php的POST请求，查看「请求载荷」板块的实际发送内容：如果这里面本来就只有radio字段，说明问题在前端，不需要调整后端代码
• 对照符合规范的最小Bootstrap表单结构，逐一修正自身代码的配置偏差：

正确结构的核心校验点：每个表单控件带非空name、位于form标签内部、无disabled标记

<form method="POST" action="./create.php">
  <div class="mb-3">
    <label>猫咪姓名</label>
    <input type="text" name="cat_name" class="form-control">
  </div>
  <div class="mb-3">
    <label>邮箱</label>
    <input type="email" name="user_email" class="form-control">
  </div>
  <div class="mb-3">
    <label>密码</label>
    <input type="password" name="user_pwd" class="form-control">
  </div>
  <div class="mb-3">
    <label>猫咪毛色</label>
    <select name="cat_fur_color" class="form-select">
      <option value="">请选择毛色</option>
      <option value="orange">橘色</option>
      <option value="black">黑色</option>
    </select>
  </div>
  <div class="mb-3">
    <label>毛发长度</label>
    <div class="form-check">
      <input type="radio" name="fur_length" value="short" class="form-check-input">
      <label class="form-check-label">短毛</label>
    </div>
    <div class="form-check">
      <input type="radio" name="fur_length" value="long" class="form-check-input">
      <label class="form-check-label">长毛</label>
    </div>
  </div>
  <div class="mb-3">
    <input type="checkbox" name="has_litter_box" value="yes" class="form-check-input">
    <label class="form-check-label">已配备猫砂盆</label>
  </div>
  <button type="submit" class="btn btn-primary">提交表单</button>
</form>

内容的提问来源于stack exchange，提问作者victorbip