From c07bfa182e0ed967342ec89c40c5da32b369ab95 Mon Sep 17 00:00:00 2001
From: dwlknsn <dwlknsn@users.noreply.github.com>
Date: Sun, 24 Nov 2024 18:43:17 -0600
Subject: [PATCH] Update turbo.md (#29117)

---
 ruby_on_rails/rails_sprinkles/turbo.md | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/ruby_on_rails/rails_sprinkles/turbo.md b/ruby_on_rails/rails_sprinkles/turbo.md
index 084bdd52f02..121707ad6f4 100644
--- a/ruby_on_rails/rails_sprinkles/turbo.md
+++ b/ruby_on_rails/rails_sprinkles/turbo.md
@@ -56,17 +56,25 @@ A frame is designated by wrapping a region inside of a `<turbo-frame>` element.
 A basic Turbo Frame, using Rails helpers, may look like so:
 
 ```erb
+# with a block
 <%= turbo_frame_tag "article" do %>
   Some content
 <% end %>
+
+# without a block (typically this is used as a placeholder element to be filled later)
+<%= turbo_frame_tag "article" %>
 ```
 
 which will generate:
 
 ```html
+# with a block
 <turbo-frame id="article">
   Some content
 </turbo-frame>
+
+# without a block
+<turbo-frame id="article"></turbo-frame>
 ```
 
 Note that the frames have an ID. The ID is how Turbo is able to identify a frame to find out which one is which.
@@ -130,7 +138,7 @@ We can also do the opposite. We can make a link that exists outside of our Turbo
 <%= link_to "Show Posts", posts_path, data: { turbo_frame: "list-region" } %>
 <%= link_to "Show Images", images_path, data: { turbo_frame: "list-region" } %>
 
-<%= turbo_frame_tag id="list-region" %>
+<%= turbo_frame_tag "list-region" %>
 ```
 
 Clicking either of the above links will send a request to the respective path and return the content inside of our `"list-region"` frame.
@@ -143,7 +151,7 @@ For example:
 
 ```erb
 ...
-<%= turbo_frame_tag id="Articles", src: articles_path do %>
+<%= turbo_frame_tag "Articles", src: articles_path do %>
   <div>
     I am a placeholder! After the request to articles_path is finished,
     I will be replaced with the content inside of that page's turbo frame
@@ -156,7 +164,7 @@ We can also make our frames **lazy loaded**. A lazy loaded frame will only fetch
 
 ```erb
 ...
-<%= turbo_frame_tag id="Articles", src: articles_path, loading: "lazy" do %>
+<%= turbo_frame_tag "Articles", src: articles_path, loading: "lazy" do %>
   <div>
     I am a placeholder! I will be replaced when a user scrolls down to see me on the page!
   </div>
@@ -186,7 +194,7 @@ Our `index` view:
 ```erb
 # views/posts/index.html.erb
 
-<%= turbo_frame_tag id="new_post", src:new_post_path %>
+<%= turbo_frame_tag "new_post", src: new_post_path %>
 <div id="posts">
   <%= render @posts %>
 </div>
@@ -197,7 +205,7 @@ Our `new` page with it's form:
 ```erb
 # views/posts/new.html.erb
 
-<%= turbo_frame_tag id="new_post" do %>
+<%= turbo_frame_tag "new_post" do %>
   <%= form_with model: @post do |form| %>
     <%= form.label :body %>
     <%= form.text_area :body %>