Rails表单提交无法导出CSV/JSON文件问题排查求助

问题分析 #

原来的link_to能正常触发下载是因为明确传递了format参数，而你使用submit_tag时错误用到了params选项——Rails的submit_tag并不支持这个参数，导致format未被正确提交到控制器，控制器默认返回HTML格式，因此只会刷新页面，不会触发文件下载。同时需确保控制器正确接收start_date和end_date参数来过滤导出数据。

解决方案 #

方法1：修改submit_tag，通过name传递format参数 #

将两个提交按钮的name设为format，value设为对应格式，提交时会自动带上format=csv或format=json参数：

<%= form_tag export_invoices_path, method: :get, class: "mb-6" do %>
  <div class="flex justify-center gap-2 items-center">
    <p class="font-semibold">Start Date:</p>
    <%= date_field_tag :start_date, params[:start_date], class: "form-control" %>
    <p class="font-semibold">End Date:</p>
    <%= date_field_tag :end_date, params[:end_date], class: "form-control" %>
    <%= submit_tag "Export to CSV", name: "format", value: "csv", class: link_classes %>
    <%= submit_tag "Export to JSON", name: "format", value: "json", class: link_classes %>
  </div>
<% end %>

方法2：用hidden_field动态切换格式（单按钮场景） #

若想用单个按钮切换导出格式，可添加下拉选择框配合hidden_field，通过JS动态切换format值：

<%= form_tag export_invoices_path, method: :get, class: "mb-6" do %>
  <div class="flex justify-center gap-2 items-center">
    <p class="font-semibold">Start Date:</p>
    <%= date_field_tag :start_date, params[:start_date], class: "form-control" %>
    <p class="font-semibold">End Date:</p>
    <%= date_field_tag :end_date, params[:end_date], class: "form-control" %>
    <%= select_tag :format_selector, options_for_select([["CSV", "csv"], ["JSON", "json"]]), class: "form-control" %>
    <%= hidden_field_tag :format, "csv" %>
    <%= submit_tag "Export", class: link_classes %>
  </div>
<% end %>

<script>
document.querySelector('#format_selector').addEventListener('change', function() {
  document.querySelector('#format').value = this.value;
});
</script>

控制器补充：实现数据过滤 #

需在export_invoices动作中，根据提交的日期参数过滤数据，否则导出的仍是全部交易：

def export_invoices
  @invoices = Invoice.all
  if params[:start_date].present? && params[:end_date].present?
    @invoices = @invoices.where(created_at: params[:start_date].to_date..params[:end_date].to_date)
  end

  respond_to do |format|
    format.csv { send_data generate_csv(@invoices), filename: "transactions-#{Date.today}.csv" }
    format.json { send_data JSON.pretty_generate(@invoices.as_json), filename: "transactions-#{Date.today}.json" }
  end
end

验证要点 #

• 提交表单后检查浏览器地址栏，确认是否带有?format=csv&start_date=xxx&end_date=xxx格式的参数
• 查看控制器日志，确认format参数被正确接收，响应格式为csv/json而非html

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