Model-backed forms in Ruby on Rails - Step-by-Step Execution

Concept Flow - Model-backed forms

User opens form page

↓

Rails controller action

↓

Create new model instance

↓

Render form with model data

↓

User fills form and submits

↓

Controller receives params

↓

Assign params to model

↓

Validate model

↓

Save model

↓

Redirect or render success

This flow shows how Rails uses a model instance to build a form, receive user input, validate, and save or show errors.

Execution Sample

Ruby on Rails

class UsersController < ApplicationController
  def new
    @user = User.new
  end

  def create
    @user = User.new(user_params)
    if @user.save
      redirect_to root_path
    else
      render :new
    end
  end

  private

  def user_params
    params.require(:user).permit(:name, :email, :password, :password_confirmation)
  end
end

This code creates a new user form and handles form submission, saving the user if valid or re-rendering the form with errors.

Execution Table

Step	Action	Model State (@user)	Validation Result	Next Step
1	User visits /users/new	User instance created, empty attributes	Not validated yet	Render form with empty fields
2	User fills form and submits	User instance with submitted attributes	Validation runs	If valid, save; else show errors
3	Validation passes	User instance valid	Valid	Save user to database, redirect to root_path
4	Validation fails	User instance invalid with errors	Invalid	Render :new template with error messages
5	Redirect or render completes	User saved or form re-rendered	N/A	End of request

💡 Request ends after redirect on success or re-render on validation failure

Variable Tracker

Variable	Start	After Step 2	After Step 3 or 4	Final
@user	new empty User instance	User instance with form data	Saved User or User with errors	Saved User or form re-rendered with errors

Key Moments - 2 Insights

Why does the form re-render with errors instead of redirecting when validation fails?

Because in step 4 the controller calls render :new to keep the @user object with errors, allowing the form to show error messages without losing user input.

What happens if we call redirect instead of render when validation fails?

Redirecting would create a new request and lose the @user object and its errors, so the form would not show validation messages or preserve user input.

Visual Quiz - 3 Questions

Look at the execution table, what is the @user state after step 2?

A User instance with submitted attributes

B Empty User instance

C Saved User in database

D User instance with errors

💡 Hint

Check the 'Model State (@user)' column in row for step 2

At which step does the controller decide to save the user or show errors?

A Step 1

B Step 2

C Step 3 or 4

D Step 5

💡 Hint

Look at the 'Validation Result' and 'Next Step' columns for steps 3 and 4

If the validation fails, what does the controller do next?

A Redirect to root_path

B Render the new form with errors

C Save the user anyway

D Raise an exception

💡 Hint

See step 4 in the 'Next Step' column

Concept Snapshot

Model-backed forms in Rails:
- Controller creates a model instance (@user = User.new)
- Form helpers bind to @user for fields
- On submit, controller assigns params to @user
- Validate with @user.save (returns true/false)
- If valid, save and redirect
- If invalid, render form with errors to show messages

Full Transcript

Model-backed forms in Rails start when the user visits a form page. The controller creates a new model instance, like @user = User.new, and renders the form with this object. The form fields are linked to the model's attributes. When the user submits the form, the controller receives the parameters and assigns them to a new model instance. It then tries to save the model, which runs validations. If validations pass, the model is saved to the database and the user is redirected. If validations fail, the form is re-rendered with error messages, preserving the user's input. This flow ensures user input is validated and feedback is shown clearly.

Practice

1. What is the main advantage of using form_with model: @model in Rails?

easy

A. It creates a form without any connection to the database.

B. It automatically links the form to the model for easy data handling.

C. It disables form validations for faster submission.

D. It generates a plain HTML form without Rails helpers.

Solution

1. Step 1: Understand model-backed forms

   Model-backed forms connect the form fields directly to the model's attributes, simplifying data handling.

2. Step 2: Recognize the role of form_with model: @model

   This helper automatically binds the form to the model instance, enabling validations and error messages.

3. Final Answer:

   It automatically links the form to the model for easy data handling. -> Option B

4. Quick Check:

   Model-backed forms = automatic model connection [OK]

Hint: Remember: model option links form to data model directly [OK]

Common Mistakes:

• Thinking it creates a form without database connection
• Assuming validations are disabled
• Confusing it with plain HTML forms

2. Which of the following is the correct syntax using form_with to create a model-backed form for a @post object in Rails?

easy

A. form_with url: posts_path do |form|

B. form_for @post do |form|

C. form_with model: @post do |form|

D. form_tag @post do |form|

Solution

1. Step 1: Identify the modern Rails form helper

   Rails 5.1+ recommends form_with for forms, replacing older helpers.

2. Step 2: Use the model option for model-backed forms

   Using model: @post binds the form to the @post instance for automatic attribute handling.

3. Final Answer:

   form_with model: @post do |form| -> Option C

4. Quick Check:

   Correct syntax uses form_with + model option [OK]

Hint: Use form_with with model: @object for model forms [OK]

Common Mistakes:

• Using form_tag which is for non-model forms
• Using form_for which is deprecated
• Using url option instead of model for model forms

3. Given the following code snippet, what will be the rendered HTML input name attribute for the title field?

form_with model: @article do |form|
  form.text_field :title
end

medium

A. article[title]

B. title

C. article_title

D. form[title]

Solution

1. Step 1: Understand Rails naming conventions for model-backed forms

   Rails uses the model name as a prefix in input names to group attributes, e.g., modelname[field].

2. Step 2: Apply to the given example

   For model @article and field :title, the input name becomes article[title] to map params correctly.

3. Final Answer:

   article[title] -> Option A

4. Quick Check:

   Input name = model[field] format [OK]

Hint: Input names use model[field] format in model-backed forms [OK]

Common Mistakes:

• Using just the field name without model prefix
• Combining model and field with underscore
• Using form as prefix instead of model name

4. Identify the error in this model-backed form code snippet:

form_with model: @user do |form|
  form.text_field :email
  form.submit
end

The form does not display validation errors when the email is invalid. Why?

medium

A. The form_with helper does not support model-backed forms.

B. The form does not include form.error_messages to show errors.

C. The form is missing local: true to enable validations.

D. The model @user lacks validations on the email attribute.

Solution

1. Step 1: Check if form_with supports model-backed forms

   form_with fully supports model-backed forms and validations automatically.

2. Step 2: Verify model validations

   If validation errors do not show, likely the model @user does not have validations defined for email.

3. Final Answer:

   The model @user lacks validations on the email attribute. -> Option D

4. Quick Check:

   Missing model validations = no errors shown [OK]

Hint: Validation errors need model validations defined [OK]

Common Mistakes:

• Assuming form_with needs local: true for validations
• Expecting form.error_messages helper to exist
• Thinking form_with can't handle model forms

5. You want to create a nested model-backed form where a Project has many Tasks. Which approach correctly handles nested attributes in the form?

hard

A. Use form_with model: @project and inside use form.fields_for :tasks to build task fields.

B. Use separate form_with for @project and each @task without nesting.

C. Use form_tag with manual input names for tasks.

D. Use form_with model: @task only, ignoring the project.

Solution

1. Step 1: Understand nested model forms in Rails

   Rails supports nested attributes allowing a parent model form to include child model fields.

2. Step 2: Use fields_for inside form_with

   To handle nested tasks inside a project form, use form.fields_for :tasks to generate fields for each task.

3. Final Answer:

   Use form_with model: @project and inside use form.fields_for :tasks to build task fields. -> Option A

4. Quick Check:

   Nested forms use fields_for inside form_with [OK]

Hint: Use fields_for inside form_with for nested models [OK]

Common Mistakes:

• Creating separate forms instead of nested
• Using form_tag which lacks model binding
• Ignoring parent model in nested forms