More from Henry Kim

RSS

Inline form validation feedback via Turbo Streams

7254 views

0 comments

                  class PostsController < ApplicationController
  def create
    @post = current_member.posts.build(post_params)

    if @post.save
      redirect_to @post, status: :see_other
    else
      respond_to do |format|
        format.turbo_stream { render :create, status: :unprocessable_entity }
        format.html { render :new, status: :unprocessable_entity }
      end
    end
  end

  private

  def post_params
    params.require(:post).permit(:title, :body)
  end
end

                  <%= turbo_stream.replace 'post_form' do %>
  <%= render 'form', post: @post %>
<% end %>

When forms live inside a Turbo Frame (modal or inline edit), validation needs to feel immediate without a full-page refresh. I render the form inside a frame with an ID like post_form. On submit, create/update returns status: :unprocessable_entity and a turbo stream that replaces the form frame, so Rails errors and field highlights appear in-place. The critical detail is returning a 422 so Turbo doesn’t treat the response as a successful navigation. This also plays nicely with form_with helpers and field_with_errors styling. I often add a small error summary at the top plus inline errors under each field.

Henry Kim

More from Henry Kim

Inline form validation feedback via Turbo Streams

0 Comments

More from Henry Kim