Barry Allen


1,900 Experience
18 Lessons Completed
0 Questions Solved


I am trying to create a modal or a drawer which allows me to edit a form.

When I place the turbo_frame_tag in the same file like so. The form shows up properly when I click the link.


<%= turbo_frame_tag 'drawer' %>
<div class="card">
    <% for person in @people %>
        <td><%= %></td>
        <td><%= link_to 'Edit', '##' %></td>
    <% end %>

  <%= link_to 'New Person', new_admin_person_path, class: 'btn', data: { turbo_frame: "drawer", action: 'click->modal#open' } %>


  <%= turbo_frame_tag "drawer" do %>
    <%= simple_form_for [:admin, @person] do |f| %>
      <%= f.input :first_name %>
      <%= f.input :last_name %>
      <%= f.submit 'Save', class: 'btn' %>
    <% end %>
  <% end %>

However when I place it in the drawer or in the modal partial. The form does not display.


<div class="admin__overlay" data-action="click->modal#close"></div>
<div class="admin__drawer">
  <%= turbo_frame_tag "drawer" %>

The output of the HTML has the src url, the network request is made with no errors. But the turboframe is empty.

HTML Output

<turbo-frame id="drawer" reloadable="" src="http://localhost:3000/admin/people/new"></turbo-frame>

Any ideas here?

Posted in Hotwire and iframes?

Hey everyone! I am working on a page builder. So the preview is in an iframe.

I am trying to make it so when I click the edit icon on a section in the iframe it displays that form in a sidebar in the parent frame.

Can this be accomplished with Hotwire or am I thinking about this the wrong way?

Screencast tutorials to help you learn Ruby on Rails, Javascript, Hotwire, Turbo, Stimulus.js, PostgreSQL, MySQL, Ubuntu, and more.

© 2023 GoRails, LLC. All rights reserved.