Render Form With Different Step Upon Form Submit

1

I’m trying to use Turbo Frame to create a simple wizard form on Rails 7. I have a form where user can fill out a company data.

I would like the form to submit and send the next step to the form on the same page without redirect to the post url.

Right now, when I submit the form, the url changes to the form url.

How do I submit inputs and return the step on the same page without changing the url to “/submit”?

Routes

resources :build_company, only: [:index]
post "build_company/submit", to: "build_company#create"

BuildCompanyController

    def index
      @company = current_user.company || current_user.build_company
      @company.save! validate: false
    end

    def create
      # Do something and defines the next step
      render turbo_stream: turbo_stream.update("company_wizard", partial: "build_company/form", locals: { step: next_step })
    end

Build Company Index

<%= render "form", step: first_step %>

Build Company Form Partial

<%= form_with url: build_company_submit_path, data: { turbo_frame: "company_wizard" } do |f| %>
  <%# Fields controlled by step %>
  <%= f.submit %>
<% end %>
2

Wrap your form in a turbo-frame, then the url won’t change when you submit.
remember to wrap the form from the submit response in a frame as well.

1 Like
3

That solved the issue with url swap. Thank you @krebil
Now I’ll investigate why requests with “text/vnd.turbo-stream.html” content-type is rendering as plain text instead of HTML and finish the form.