Rails中生成的CSV文件无法下载的问题修复求助

核心问题 #

添加样式后的表单存在嵌套<form>标签，这违反HTML规范，且内层<form action="#">会覆盖外层form_with的正确提交路径；同时嵌套结构会导致浏览器解析异常，最终使表单提交行为偏离预期，无法触发文件下载。此外，按钮嵌套写法会生成冗余提交元素，进一步干扰表单行为。

修复步骤及代码示例 #

将嵌套的<form>替换为<div>以保留样式结构，直接使用f.submit设置按钮样式，并显式指定local: true确保非AJAX提交（AJAX请求无法触发浏览器下载）：

<%= form_with url: export_reports_path, method: :post, class: "space-y-7", local: true do |f| %>
  <div class="mt-3">
    <%= f.label :hours_file, class: "block my-2 text-sm font-medium text-gray-900 dark:text-gray-300"%>
    <%= f.file_field :hours_file, direct_upload: 'false', class: "block w-full p-1.5 text-sm text-gray-900 bg-gray-50 rounded-lg border border-gray-300 cursor-pointer dark:text-gray-400 focus:outline-none dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400" %>
  </div>
  <%= f.submit "Create", class: "mt-10 flex w-full items-center justify-center rounded-md border border-transparent bg-indigo-600 py-3 px-8 text-base font-medium text-white hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2" %>
<% end %>

关键说明 #

• HTML禁止嵌套<form>标签，浏览器会忽略内层或外层表单的部分属性，导致提交目标错误。
• form_with默认启用AJAX提交（remote: true），即使包含文件字段时Rails会自动禁用AJAX，显式设置local: true可避免潜在的AJAX干扰，确保服务器返回的send_data能直接触发浏览器下载。
• 移除按钮嵌套写法，直接通过f.submit添加样式类，避免生成重复的提交控件，保证表单提交逻辑清晰。

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