title: Multistep forms in Rails using AJAX
body: <p>I'm following Railscast #217 which shows how to build a multistep form out of partials.  I followed Ryan's directions and got my code to work but was wondering how to convert this so that Rails will use AJAX to load the partials?</p>
  
  <p><strong>users_controller.rb</strong></p>
  
  <pre><code>class UsersController &lt; ApplicationController
    ...
    def new
      session[:user_params] ||= {}
      @user = User.new
    end
  
    def create
      session[:user_params].deep_merge!(params[:user]) if params[:user]
  
      params.each do |key,value|
        session.deep_merge!(key=&gt;value) if params[:user]
      end
  
      @user = User.new(session[:user_params])
      @user.current_step = session[:user_step]
      if params[:prev_button]
        @user.previous_step
      elsif @user.last_step?
        @user.save
      else
        @user.next_step
      end
  
      session[:user_step] = @user.current_step
  
      if @user.new_record?
        render :new
      else
        session[:user_step] = session[:user_params] = nil
        flash[:success] = "Welcome to Friends First!"
        redirect_to @user
      end
      ...
  end
  </code></pre>
  
  <p><strong>user.rb</strong></p>
  
  <pre><code>class User &lt; ActiveRecord::Base
    attr_writer :current_step
  
    def current_step
      @current_step || steps.first
    end
  
    def steps
      %w[step1 step2 step3]
    end
  
    def next_step
      self.current_step = steps[steps.index(current_step) + 1]
    end
  
    def previous_step
      self.current_step = steps[steps.index(current_step) - 1]
    end
  
    def first_step?
      current_step == steps.first
    end
  
    def last_step?
      current_step == steps.last
    end
  end
  </code></pre>
  
  <p><strong>new.html.erb</strong></p>
  
  <pre><code>&lt;%= simple_form_for(@user) do |f| %&gt;
    &lt;%= render 'shared/error_messages' %&gt;
  
    &lt;%# render @user.current_step, :f =&gt; f %&gt;
  
    &lt;div id="form"&gt;&lt;/div&gt;
  
    &lt;div class="center"&gt;
      &lt;%= f.submit "Previous", class: "btn btn-primary", :name =&gt; "prev_button" unless @user.first_step?  %&gt;
      &lt;%= f.submit "Next", class: "btn btn-primary", :name =&gt; "next_button" unless @user.last_step? %&gt;
      &lt;%= f.submit "Submit", class: "btn btn-primary", :name =&gt; "submit_button" if @user.last_step? %&gt;
    &lt;/div&gt;
  
  
  &lt;% end %&gt;    
  </code></pre>
  
  <p><strong>EDIT</strong>
  I'm going to post one of my partials. Notice the <code>f</code> variable - I don't know how to pass that into my partial from the form using AJAX.</p>
  
  <p><strong>_step1.html.erb</strong></p>
  
  <pre><code>&lt;div class="offset1"&gt;
    &lt;%= f.input :first_name %&gt;
    &lt;%= f.input :last_name %&gt;
    &lt;%= f.input :email %&gt;
    &lt;%= f.input :password %&gt;
    &lt;%= f.input :password_confirmation %&gt;  
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>create.js.erb</strong></p>
  
  <pre><code>$('#form').html('&lt;%= escape_javascript(render(@user.current_step)) %&gt;');
  </code></pre>
  
  <p>This doesn't work, I need to pass <code>f</code> in somehow.</p>