如何在Rails共享头部提交不同步骤的Campaign表单

不用JS的话，可以利用HTML5的form属性配合Rails表单，实现共享头部按钮提交当前步骤的表单，具体步骤如下：

1. 给每个步骤的表单设置唯一ID #

在每个步骤的表单视图中，给form_with添加唯一的id属性，关联当前步骤：

<%= form_with(model: @campaign, url: send("step#{@step}_submit_merch_campaign_path"), method: :patch, html: { id: "step-#{@step}-form" }) do |f| %>
  <!-- 当前步骤的表单字段 -->
<% end %>

2. 修改头部的「下一步」按钮 #

把原来的link_to替换为原生button标签，通过form属性指定要提交的表单ID，同时设置type="submit"：

<% if @step < 6 && @step > 2 %>
  <button class="btn btn-accent" id="next-step-btn" type="submit" form="step-<%= @step %>-form">Siguiente</button>
<% end %>

点击头部按钮时，会直接触发对应步骤表单的提交，完全是HTML原生行为，不需要JS。

3. 完善控制器的提交逻辑 #

每个步骤的提交action需要处理参数更新，并根据验证结果跳转或回显：

def step1
  @step = 1
  @elements = Product.where(tipo: "box", active: true)
end

def step1_submit
  @campaign = Campaign.find(params[:id])
  if @campaign.update(step1_params)
    redirect_to step2_merch_campaign_path(@campaign)
  else
    # 验证失败时回到步骤1，保留错误信息
    render :step1
  end
end

private

def step1_params
  params.require(:campaign).permit(:your_field1, :your_field2) # 替换为当前步骤需要的字段
end

4. 确保路由配置正确 #

在routes.rb中添加每个步骤的GET和PATCH路由：

resources :merch_campaigns do
  member do
    get :step1
    patch :step1_submit
    get :step2
    patch :step2_submit
    # 依次添加其他步骤的路由
  end
end

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