Fetching a partial on click

Hey @BKSpurgeon, welcome to the forum!

Without knowing the full details of your page and thus any factors that might make this a bad idea, my first suggestion would be to render all of the additional details onto the page and then just show and hide them as necessary. This recent post does something similar, with sample code. It’s just toggling a class.

If that doesn’t work (e.g. it’s going to add, I dunno, megabytes of data to the page load), I’d guide you in the direction of your second option. Just call out to a normal controller that returns a normal payload but without a layout (so the customer details response doesn’t have html, body, etc. tags). Then have a Stimulus controller just plop that onto the page.

The great thing about that approach is the JS can easily be written so that it’s dumb - instead of a CustomerDetailController, for instance, it could be a RenderResponseController that does nothing more than call out to a URL and place the response into a specified target div. Then, any time you need to do some AJAXy rendering, you’re writing no additional JS (just re-use this controller) and just returning pre-rendered HTML from the backend.

That said, with that option you do still need to handle possible errors from the backend when fetching the customer info. Just one more reason why simply pre-rendering the customer info, if possible, would be preferred here.

Hope this helps!