<!DOCTYPE html><html><head><title></title><style type="text/css">p.MsoNormal,p.MsoNoSpacing{margin:0}</style></head><body><div>Hey Andy,<br></div><div><br></div><div>I've got an issue open on hotwired/turbo for this purpose. There are solutions there, but they aren't super intuitive. <a href="https://github.com/hotwired/turbo/issues/138">https://github.com/hotwired/turbo/issues/138</a><br></div><div><br></div><div>I'm gonna come out and say that this is something Turbo should support out of the box. I think due to the way Turbo is architected that this isn't immediately possible, so it's sort of a shame things have to be this way... Feel free to get in touch if you've got any more Turbo questions - I've been running it in production since its release back at the end of 2020.<br></div><div><br></div><div>Thanks,<br></div><div><br></div><div>Simon</div><div><br></div><div>On Thu, Jan 27, 2022, at 3:18 PM, Andrew Stewart wrote:<br></div><blockquote type="cite" id="qt" style=""><div>Hello LRUG!<br></div><div><br></div><div>I'm upgrading a Rails 6.1 app to Rails 7 and am stuck on a straightforward problem. Hopefully I've just overlooked something obvious which a fresh pair of eyes will spot immediately :)<br></div><div><br></div><div>So I have a Thing model. On the things index page there is a list of things and a new-thing form in a hidden modal at the bottom of the page. When the user clicks an "Add thing" button the modal opens.<br></div><div><br></div><div>The behaviour I want is:<br></div><div><br></div><div>- when the user submits an invalid form, the form re-renders in the modal with error messages etc;<br></div><div>- when the user submits a valid form, the index page is reloaded – thus clearing away the modal with the filled-in form, showing the newly created thing in the list, and having a fresh new-thing form in a hidden modal.<br></div><div><br></div><div>Unfortunately I'm able to achieve one or the other, but not both.<br></div><div><br></div><div>This pattern of render on error, redirect on success was an issue for a while when Stimulus first came out, and then Turbo, but I thought it was all fixed up now. Unfortunately searching online mainly yields a gazillion workarounds and hacks from the early days which don't apply any more.<br></div><div><br></div><div>Here's the (pseudo-)code:<br></div><div><br></div><div><br></div><div># things index page<br></div><div><br></div><div> <!-- The data attributes are for a Stimulus controller which handles opening/closing modals --><br></div><div> = link_to '#', data: {controller: 'modal', action: 'modal#open', modal_id_param: 'thing-form'} do<br></div><div> Add a new thing<br></div><div><br></div><div> [ list of things ]<br></div><div><br></div><div> <div id="thing-form" class="modal" ...modal attributes...><br></div><div> ...modal markup...<br></div><div><br></div><div> = render partial: 'new', locals: {thing: Thing.new}<br></div><div> </div><br></div><div><br></div><div><br></div><div># new thing partial<br></div><div><br></div><div> = turbo_frame_tag 'thing' do<br></div><div> = form_with model: thing, id: dom_id(thing) do |f|<br></div><div> ...input fields...<br></div><div><br></div><div><br></div><div># new thing page<br></div><div><br></div><div> = render partial: 'new', locals: {thing: @thing}<br></div><div><br></div><div><br></div><div># things controller<br></div><div><br></div><div> def create<br></div><div> thing = Thing.new thing_params<br></div><div> if thing.save<br></div><div> redirect_to things_path, status: :see_other<br></div><div> else<br></div><div> render :new, status: :unprocessable_entity # or we could render the _new partial and ditch the new page<br></div><div> end<br></div><div> end<br></div><div><br></div><div><br></div><div>With the code above, an invalid form submission renders into the modal as required, but a successful form submission doesn't reload the index page. The controller correctly sends a 303 redirect, and Turbo sees it and issues a fresh fetch for the index page – but for some reason doesn't replace/merge the page body. I'm actually not sure what it does.<br></div><div><br></div><div>I have also tried:<br></div><div><br></div><div>- adding `target: '_top'` to the turbo frame;<br></div><div>- adding `data-turbo-frame="_top"` to the form;<br></div><div>- both of the above.<br></div><div><br></div><div>I can get the results I want if I use turbo stream responses from the controller to "manually" alter the view. But that feels wrong – like hard-coding something which shouldn't be hard-coded – and would require custom turbo stream responses everywhere else I use a form in a modal. Also this is a completely standard pattern and I believe that Turbo Drive / Frames should handle it without knowing details of the view.<br></div><div><br></div><div>Any suggestions would be much appreciated!<br></div><div><br></div><div>Many thanks,<br></div><div><br></div><div>Andy Stewart<br></div><div>_______________________________________________<br></div><div>Chat mailing list<br></div><div><a href="mailto:Chat@lists.lrug.org">Chat@lists.lrug.org</a><br></div><div>Archives: <a href="http://lists.lrug.org/pipermail/chat-lrug.org">http://lists.lrug.org/pipermail/chat-lrug.org</a><br></div><div>Manage your subscription: <a href="http://lists.lrug.org/options.cgi/chat-lrug.org">http://lists.lrug.org/options.cgi/chat-lrug.org</a><br></div><div>List info: <a href="http://lists.lrug.org/listinfo.cgi/chat-lrug.org">http://lists.lrug.org/listinfo.cgi/chat-lrug.org</a><br></div><div><br></div></blockquote><div><br></div></body></html>