Laravel 9 Blade表单中Tailwind Toggle组件无法传递值问题

核心问题原因 #

你的复选框input标签设置了value=""空值，导致即使选中提交，传递的也是空字符串；而未选中时，复选框默认不会被包含在表单请求中，Laravel接收时就会返回null。

具体解决步骤 #

• 给复选框设置有效value值
  修改input的value为具体值（比如1），这样选中时会提交该值，未选中时字段不会出现在请求里，你可以在后端用$request->boolean('goal')自动转换为布尔值，或者设置默认值：

  <label class="relative inline-flex items-center cursor-pointer">
      <input type="checkbox" name="goal" value="1" class="sr-only peer">
      <div class="w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-blue-300 dark:peer-focus:ring-blue-800 rounded-full peer dark:bg-gray-700 peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all dark:border-gray-600 peer-checked:bg-blue-600"></div>
      <span class="ml-3 text-sm font-medium text-gray-900 dark:text-gray-300">Goal</span>
  </label>
  

  后端处理示例：

  $goal = $request->boolean('goal'); // 选中为true，未选中为false
  // 或者设置默认值
  $goal = $request->get('goal', false);
  

• 添加隐藏字段确保始终有值提交
  如果需要不管是否选中，表单都提交该字段（比如默认值为0），可以在复选框前添加一个同名隐藏input：

  <label class="relative inline-flex items-center cursor-pointer">
      <input type="hidden" name="goal" value="0">
      <input type="checkbox" name="goal" value="1" class="sr-only peer">
      <div class="w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-blue-300 dark:peer-focus:ring-blue-800 rounded-full peer dark:bg-gray-700 peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all dark:border-gray-600 peer-checked:bg-blue-600"></div>
      <span class="ml-3 text-sm font-medium text-gray-900 dark:text-gray-300">Goal</span>
  </label>
  

  这样选中时提交goal=1，未选中时提交goal=0，后端直接取$request->input('goal')即可得到对应数值。

额外检查点 #

• 确认表单使用了POST方法，并且包含@csrf指令，避免请求被Laravel的CSRF保护拦截。
• 检查浏览器开发者工具的Network面板，查看表单提交的Form Data，确认字段值是否正确传递。

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