Hey all, wondering if anyone could give me a sanity check on an approach I’ve been spiking out. Context: Rails/Turbolinks enabled Situation: when a user clicks on a button, I want to show a modal that renders content. I found two approaches that I wasn’t really happy with: Render a hidden (with…

You said, that you are using Rails. In that case I would probably go with Server-generated JavaScript Response (SJR) + Stimulus. You can render the modal in the backend, inject it into the DOM with SJR and use Stimulus to manage it. Something like the following. Use rails-ujs to create an Ajax link…

Ah – thanks! I did forget about SJR as an option, that does seem to fit the bill.

hey hey hey! I happen to have written a gem that solves this exact problem! It uses SJR. And it doesn’t have any dependencies. It doesn’t use Stimulus because Stimulus wasn’t a thing then. With it, you could to write an SJR response such as Popup("<%=j render 'modal' %>").show("up") to display y…

I agree that your modal should be requested when needed and rendered on the server to take advantage of ActionView. But … I never liked using JQuery in any server response. Specifically I think of modals as html views and not javascript views. And the client framework should know how and where to r…

For those reading this now, this problem can now be simply solved with turbo-frames from the turbo-rails gem and a little bit of stimulus js. This approach seems to work well for me: # some view <%= turbo_frame_tag "new_group" do %> <%= link_to "New group", new_group_path %> <% end %> # gro…

Right. Very useful as the whole page will not get replaced as before but only the frame. What about populating the frame via the server? For example, editing an existing form record within a modal. I’ve been trying to use a stream to send down the HTML but it is not happening for me. Did you do thi…

I, too, am trying to perfect a “use modal for new/edit posts” pattern - and so far this is what I’ve got (and I do apologise for the mix of Erb/HAML templating). I like the FAB [fixed action button] so my ambition is to keep the posts#index in focus and inject @post into the modal. My posts_controll…

Yes the frame is populated entirely by the server. I’ve managed to successfully do this with a form to create a new record - but the approach could just as easily be applied to editing a post (or in the example used above, a new Group record). (Pls note that I do have client side validation to prev…

Injector controller: pattern for modals

minimul January 22, 2021, 2:51pm 10

Thanks @BKSpurgeon. I did get server side population working => Routing in a modal interface - #6 by minimul.

Topic		Replies	Views
Routing in a modal interface	19	4656	March 4, 2022
Patterns for Edit Modal and Page Updates	2	3126	September 23, 2018
Rails stimulus dynamic modal need feedback	0	2370	July 3, 2020
Dynamically load content into Bootstrap Modal (using Turbo/Stimulus)	2	3612	November 28, 2022
Turbo stream with modal and reusable views	6	4591	February 18, 2025

Injector controller: pattern for modals

Related topics